怎么在vue项目中优化CDN加速

　　介绍

本篇文章为大家展示了怎么在vue项目中优化CDN加速,内容简明扼要并且容易理解,绝对能使你眼前一亮,通过这篇文章的详细介绍希望你能有所收获。

项目根目录运行

npm  install  webpack-bundle-analyzer ——save-dev

在构建/webpack.dev.conf.js中引入

const  BundleAnalyzerPlugin =,需要(& # 39;webpack-bundle-analyzer& # 39;) .BundleAnalyzerPlugin 　　,插件:[ 　　,new  BundleAnalyzerPlugin () 　　之前,)

运行后显示可以看到几个大的js下面是已经优化过后的截图

像vue, vue-router, vuex, axios, mint-ui, crypto-js

怎么在vue项目中优化CDN加速

<强> 1。使用CDN资源

其作用是:当我们加载页面时,需要将我们所需要的一些依赖加载到当前会话中然后再开始执行,如果我们首屏,模块比较多是,需要等待的时间会比较长,而且。浏览器内存最多执行四十个进程,需要等到加载完前面的才能执行后面的代码,如果我们采用CDN的方式来引入一些第三方资源,就可以缓解我们服务器的压力,原理是将我们的压力分给其他服务器点。

使用CDN在索引。html中引入

& lt; ! DOCTYPE  html> 　　& lt; html> 　　& lt; head> 　　,& lt; meta  charset=皍tf-8"比; 　　,& lt; https://www.yisu.com/zixun/script  src="//cdn.bootcss.com/vue/2.5.2/vue.min.js ">