vue项目开启Gzip压缩和性能优化

vue 项目开启gzip自拍压缩和部署 nginx 开启gzip优化性能

1. 在vue项目中安装依赖（因为存在版本兼容问题，所以使用版本1.1.11）：npm install --save-dev compression-webpack-plugin@1.1.11

2. 开启Gzip压缩：将config/index.js文件夹下的productionGzip改为true

3. 开启 nginx 服务端 gzip性能优化。找到nginx配置文件在 http 配置里面添加如下代码，然后重启nginx服务即可。

http:{ 

      gzip on; 

      gzip_static 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;

}

总结一下，vue开启gzip性能优化主要分为两部分，成功开启后将大大优化vue首页加载时长。