这是我参与11月更文挑战的第4天，活动详情查看：2021最后一次更文挑战
优化前后效果对比图：
从图片中可以看出，打包后的文件在压缩后的情况下，还少了300多k，在网速没有影响的情况下，首屏的加载速度进一步提升。
cdn优化前：
cdn优化后：
可以通过对比看出来，事实上速度并没有很大的提升，这可能与当前的网络环境有关。不放心别人的cdn时，将上述的 cdn 文件内容下载到本地放在 static 目录下当做静态文件即可。
一、修改index.html
CDN(内容分发网络)，是一种公共服务，他本身有很多台位于不同地域、接入不同运营商的服务器，而所谓的使用CDN实质上就是让CDN作为网站的门面，用户访问到的是CDN服务器，而不是直接访问到网站。由于CDN内部对TCP的优化、对静态资源的缓存、预取，加上用户访问CDN时，会被智能地分配到最近的节点，降低大量延迟，让访问速度可以得到很大提升。
可以将一些大的库放上去，首先打开package.json,看看有哪些是可以进行cdn优化的，在我的项目中，我将vue,vue-router,echarts都放到了cdn上。
打开BootCDN，然后搜索关键字并copy链接粘贴到index.html的body闭合标签前，如下图：
这里的版本号一定要和package.json上的版本号对应上
二、修改vue.config.js配置文件
在configureWebpack里面添加，目的是不打包这些选项：
externals: {
'vue': 'Vue',
'echarts': 'echarts',
'vue-router': 'VueRouter',
"prismplayer": "prismplayer"
},
三、package.json
package.json中这些依赖都可以删除掉了
四、main.js
main.js中这些相关的引入也可以去掉了
