开启gzip压缩

首先先安装依赖，"compression-webpack-plugin": "^5.0.1", 建议用5.0.1，高版本的话有问题

然后再vue.config.js中

const CompressionPlugin = require('compression-webpack-plugin')

configureWebpack: config => {

config.plugins.push(

new CompressionPlugin({

filename: '[path].gz[query]',

        algorithm: 'gzip',

        test: /\.js$|\.html$|\.css/,

        threshold: 10240, // 只有大小大于该值的资源会被处理10240

        minRatio: 0.8, // 只有压缩率小于这个值的资源才会被处理

        deleteOriginalAssets: true // 删除原文件

      })

)

}

然后再配置一下nginx

gzip on; # 开启Gzip

gzip_static on; # 开启静态文件压缩

gzip_min_length  1k; # 不压缩临界值，大于1K的才压缩

gzip_buffers    4 16k;

gzip_http_version 1.1;

gzip_comp_level 2;

gzip_types    text/plain application/javascript application/x-javascript text/javascript text/css application/xml application/xml+rss; # 进行压缩的文件类型

gzip_vary on;

gzip_proxied  expired no-cache no-store private auth;

gzip_disable  "MSIE [1-6]\.";