CDN的作用:


      1.CDN通过外链的方式引入依赖包, 可以有效的加速项目首屏的加载速度

      2.不打包对应的依赖, 可以减少前端build之后包的大小

在Vue3.0项目中使用CDN
      1.需要在Vue3.0项目的vue.config.js里面配置使用CDN进行加载的项
      

configureWebpack: {
    externals: {
        'vue': "Vue"
    // 不参与打包的包名和依赖包的名称, 配置后需要配合外链或者其他方式进行引入对应的依赖包
    }
}

     2.在main.js里面把使用Vue.use()到Vue上面的包删除

       
     3.在index.html里面使用外链的方式引入CDN

<script src="XXX.js"></script>
// 这里的CDN可以使用bootstrap的免费CDN进行加加速

       bootCDN 网址:https://www.bootcdn.cn
       在这里查找对应的框架选择版本进行引入

     
     4.在package.json里面的dependencies对应的包名删除

     5.重启项目查看结果

Logo

前往低代码交流专区

更多推荐