在初次vue打包之后，文件非常大，所以采取了几种方法优化打包，打包后文件大小确实是显著下降了，如果还有不完善的地方，欢迎一起探讨。
1、路由懒加载
当打包构建应用时，Javascript 包会变得非常大，影响页面加载。如果我们能把不同路由对应的组件分割成不同的代码块，然后当路由被访问的时候才加载对应组件，这样就更加高效了。
所以在router文件夹下 index.js 做如下配置
2、不生成.map文件
webpack默认会生成map文件，map文件是用来调试代码的。此外，这里还要注意sourcemap的配置分 开发（dev）和线上（build）两个地方配置，开发我们就不管了，就用默认的，线上我们是不需要这个代码的。
build配置如下在 config ==> index.js 里面
3、查看打包文件结构 和 各种文件的比例
这里推荐使用 webpack-bundle-analyzer，通过她可以查看打包文件的模块组成，找出不和时宜的存在，然后优化她。
首先 npm install --save-dev webpack-bundle-analyzer
然后运行 npm run build --report 命令会自动打包，并弹出网页（包含打包文件图）
这里是因为 webpack-bundle-analyzer 的配置 vue-cli(2.0)已经帮你配置好了，传入一个report参数 就可以启动了
优化之后打包图
4、cdn加速
首先在index.html引入这些包
然后在 webpack.base.conf.js 里面的 webpackConfig里面下面代码（避免webpack打包vue相关）
cdn 后引入还是正常的 import引入
externals: {
'vue': 'Vue',
'vue-router': 'VueRouter',
'vuex': 'Vuex',
'axios': 'axios',
}
5、不让css打包在一起(让css文件和单文件打包在一起)
默认css会打包到一个css 里面，一个就太大了
所以 在 webpack.prod.conf.js 里面把所有块打包在一起设置为false
allChunks: false,
