集成compression-webpack-plugin插件实现打包Gzip压缩

RuoYi

2021-12-20 a028b566edf0546b75ec6483337480132b8fb6d6

集成compression-webpack-plugin插件实现打包Gzip压缩

 ruoyi-ui/package.json

@@ -67,6 +67,7 @@
    "babel-eslint": "10.1.0",

    "babel-plugin-dynamic-import-node": "2.3.3",

    "chalk": "4.1.0",

    "compression-webpack-plugin": "5.0.2",

    "connect": "3.6.6",

    "eslint": "7.15.0",

    "eslint-plugin-vue": "7.2.0",


 ruoyi-ui/vue.config.js

@@ -5,6 +5,8 @@
  return path.join(__dirname, dir)

}



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



const name = process.env.VUE_APP_TITLE || '若依管理系统' // 网页标题



const port = process.env.port || process.env.npm_config_port || 80 // 端口

@@ -55,7 +57,16 @@
      alias: {

        '@': resolve('src')

      }

    }

    },

    plugins: [

      new CompressionPlugin({

        test: /\.(js|css|html)?$/i,     // 压缩文件格式

        filename: '[path].gz[query]',   // 压缩后的文件名

        algorithm: 'gzip',              // 使用gzip压缩

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

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

      })

    ],

  },

  chainWebpack(config) {

    config.plugins.delete('preload') // TODO: need test