vue性能优化之Gzip压缩
1.安装依赖:
compression-webpack-plugin是一个非常好用的压缩插件,适用于vue-cli版本2以上, 安装的时候一定要带上版本号, 否则的话,版本太高 可能会报错。
npm install --save-dev [email protected]
2.修改config下的index.js,将 productionGzip 改为true
3.修改build下的 webpack.prod.conf.js,将assert 改为fileName,不修改的话会报错。
4.配置ngnix
gzip on;
gzip_buffers 4 16k;
gzip_comp_level 5;
gzip_types text/plain application/javascript text/css application/xml text/javascript application/x-httpd-php image/jpeg image/gif image/png;
至此,配置就完成。
5.我们打包一下。可以看到所有的文件都生成了一个同名的gz文件,最大的文件大小直接从1.7M 压缩到300k,效果还是可以的。