Vue项目打包和优化

1.初次打包分析项目

npm run build --report

完成之后会自动打开浏览器出现各个打包模块的大小，

2.尽可能减小模块体积，

比如组件库的按需加载，能不用第三方的库就尽量不用，或者看看官方有什么优化的方式。还有使用懒加载（路由懒加载和图片懒加载优化性能），为了减小服务器压力，可以将小于10KB的图片变成base64编码，这样减少http请求次数，当然图片太大就没有必要，图片太大会增大占用的内存，影响页面的加载速度。而且会使整个项目包变大。

3.在config文件中的index.js中开启压缩

//开启gzip压缩
    productionGzip: true,

这时在运行npm run build ,会报错，需要安装一个插件
compression-webpack-plugin: “^1.1.2”,
我是安装的这个版本，直接安装最新版本出现了版本冲突问题，所以就安装了这个低版本的。
安装之后在运行build命令就可以了。
对于很小的项目来说，使用gzip压缩之后可能比之前没压缩的还大，这时候就没有必要压缩了，对于大型的项目来说压缩后肯定是变小的

4.前端项目的性能优化
前端性能优化
前端性能优化
前端性能优化
多入口打包
html-webpack-plugin详解