gzip性能优化

1.安装compression-webpack-plugin（我这边用的是^6.1.1）

2. vue.config.js配置

// 引入插件

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

chainWebpack(config) {    

        ....其他配置..

config

      .when(process.env.NODE_ENV !== 'development',

        config => {

          config.plugin('compressionPlugin').use(

            new CompressionWebpackPlugin({

              algorithm: 'gzip',

              test: new RegExp('\\.(' + ['js', 'css'].join('|') + ')$'),

              filename: '[path][base].gz', // 压缩后的文件名(保持原文件名，后缀加.gz)

              minRatio: 1, // 压缩率小于1才会压缩

              threshold: 10240, // 对超过10k的数据压缩

              deleteOriginalAssets: false

            })

          )

        })

}

3. nginx配置

gzip on;

gzip_static on;

gzip_comp_level 2;

gzip_types text/plain text/html text/css application/x-javascript text/xml application/xml application/xml+rss text/javascript;  

4.浏览器上查看

 有gzip则代表成功