Vue打包时gzip压缩

Vue打包时gzip压缩

一、安装插件
npm install compression-webpack-plugin --save-dev

二、配置
vue.config.js内生产模式下配置gzip

config.plugin('compressionPlugin').use( new CompressionPlugin({
        filename: "[path].gz[query]",
        algorithm: "gzip",
        test: /\.(js|css|json|txt|html|ico|svg)(\?.*)?$/i,  //所有匹配此{RegExp}的资产都会被处理
        threshold: 512,   // 只处理大于此大小的资产。以字节为单位
        minRatio: 0.8,    // 压缩比例
        deleteOriginalAssets: false //是否删除原资源
      }))

三、配置Nginx --nginx.conf文件内

http {
    #开启gzip压缩
    gzip on;
    #http的协议版本
    gzip_http_version 1.0;
    #IE版本1-6不支持gzip压缩，关闭
    gzip_disable 'MSIE[1-6].';
    server {
        listen 80;
        server_name  localhost;
    }
}

四、完成后的文件后缀是.gz