vue-cli3 配置 gzip 压缩

vue-cli3 配置 gzip 压缩

vue.config.js 配置

const CompressionWebpackPlugin = require("compression-webpack-plugin");
const productionGzipExtensions = /\.(js|css|json|txt|html|ico|svg)(\?.*)?$/i;

module.exports = {
    configureWebpack: config => {
        const plugins = [];

        // Begin 生成 gzip 压缩文件
        plugins.push(
            new CompressionWebpackPlugin({
                filename: "[path].gz[query]",
                algorithm: "gzip",
                test: productionGzipExtensions,
                threshold: 10240,
                minRatio: 0.8
            })
        );
        // End 生成 gzip 压缩文件
        
        config.plugins = [...config.plugins, ...plugins];
    }
}

nginx.conf 配置

gzip_static on; # 开启 gzip 压缩

如果服务器配置未生效，可参考下文设置:

https://juejin.im/post/5bf422a46fb9a049dd7fe668

https://segmentfault.com/q/1010000010184927/a-1020000010194441