欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

vue-cli3 配置 gzip 压缩

程序员文章站 2022-03-29 13:57:22
...
  • 安装插件 

npm i -D compression-webpack-plugin
  • vue.config.js 配置

//引入该插件
const CompressionWebpackPlugin = require("compression-webpack-plugin")
//匹配此 {RegExp} 的资源
const productionGzipExtensions = /\.(js|css|json|txt|html|ico|svg)(\?.*)?$/i

module.exports = {
    configureWebpack: config => {

        const plugins = []
        // start 生成 gzip 压缩文件
        plugins.push(
            new CompressionWebpackPlugin({
                filename: "[path].gz[query]", //目标资源名称
                algorithm: "gzip",
                test: productionGzipExtensions, //处理所有匹配此 {RegExp} 的资源
                threshold: 10240,//只处理比这个值大的资源。按字节计算(楼主设置10K以上进行压缩)
                minRatio: 0.8 //只有压缩率比这个值小的资源才会被处理
            })
        );

        // End 生成 gzip 压缩文件
        config.plugins = [...config.plugins, ...plugins];
    }
}
  •  nginx.conf 配置

可参考 https://www.cnblogs.com/Renyi-Fan/p/11047490.html