这段时间因为免费试用了 https://free.aliyun.com/ 一台阿里云的服务器，配置是 2核4G 2M，
因为带宽太低了，每次在第一次加载的时候太慢了，通过F12调试，发现主要是因为加载的 js 过大而引起的。因此本文将主要讲解Vue项目打包后js、css、svg等文件过大的解决办法。
通过引入 compression-webpack-plugin 插件来打包，然后开启 nginx gzip 来解决问题
配置 compression-webpack-plugin 前后打包对比，我们查看 dist目录，能够发现大于10KB的 js ， css 等文件已经被压缩了
因app首页加载不流畅，于是去检查首页加载项的耗时，最终发现是前端加载时js文件太大，导致首页加载太慢，于是选择了以下方案进行优化。
一、安装compression-webpack-plugin插件。前端将文件打包成.gz文件，然后通过nginx的配置，让浏览器直接解析.gz文件，可以大大提升文件加载的速度。
二、接下来要去修改vue的配置文件 vue.config.js
三 打包后对比
在vue.config.js文件中的chainWebpack配置插件，默认会在8888端口打开
根据之前打包分析图来看，主要是locale下moment的其他语言包占用体积较大。默认是en的语言包，所以在无需其他语言的情况下，可以直接忽略掉locale下的文件不打包。
解决方案：用webpack自带的IgnorePlugin插件
vue.config.js文件
将引用的外部js、css文件剥离开来，不编译到vendor.js中，而是用资源的形式引用，这样浏览器可以使用多个线程异步将vendor.js、外部的js等加载下来，达到加速首开的目的。
外部的库文件，可以使用CDN资源，或者别的服务器资源等。
cdn引入的地址可以参考官网
https://cn.vuejs.org/v2/guide/installation.html#CDN
也可以像这篇文章是直接在vue.config.js中配置cdn的url地址 vue-cli3打包项目引入外部CDN资源文件
moment的其他语言包没有被打包了，vue等文件也都用的cdn文件，没有被打包进去vendor。
