vue 項目開啟gzip 壓縮和性能優化

gzip

在vue項目中安裝依賴並將productionGzip改為true，開啟Gzip壓縮：npm install --save-dev compression-webpack-plugin

運行 npm run build打包項目，這時可能會報錯，提示ValidationError: Compression Plugin Invalid Options。根據官網提示，需要將CompressionWebpackPlugin的設置由asset改為filename。

錯誤：

修改 將asset改為filename:

再次 運行 npm run build

服務端

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

參考原文地址：https://jingyan.baidu.com/album/454316ab29d0c0f7a7c03a1f.html?picindex=1