作者 RuoYi

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

@@ -67,6 +67,7 @@ @@ -67,6 +67,7 @@
67 "babel-eslint": "10.1.0", 67 "babel-eslint": "10.1.0",
68 "babel-plugin-dynamic-import-node": "2.3.3", 68 "babel-plugin-dynamic-import-node": "2.3.3",
69 "chalk": "4.1.0", 69 "chalk": "4.1.0",
  70 + "compression-webpack-plugin": "5.0.2",
70 "connect": "3.6.6", 71 "connect": "3.6.6",
71 "eslint": "7.15.0", 72 "eslint": "7.15.0",
72 "eslint-plugin-vue": "7.2.0", 73 "eslint-plugin-vue": "7.2.0",
@@ -5,6 +5,8 @@ function resolve(dir) { @@ -5,6 +5,8 @@ function resolve(dir) {
5 return path.join(__dirname, dir) 5 return path.join(__dirname, dir)
6 } 6 }
7 7
  8 +const CompressionPlugin = require('compression-webpack-plugin')
  9 +
8 const name = process.env.VUE_APP_TITLE || '若依管理系统' // 网页标题 10 const name = process.env.VUE_APP_TITLE || '若依管理系统' // 网页标题
9 11
10 const port = process.env.port || process.env.npm_config_port || 80 // 端口 12 const port = process.env.port || process.env.npm_config_port || 80 // 端口
@@ -55,7 +57,16 @@ module.exports = { @@ -55,7 +57,16 @@ module.exports = {
55 alias: { 57 alias: {
56 '@': resolve('src') 58 '@': resolve('src')
57 } 59 }
58 - } 60 + },
  61 + plugins: [
  62 + new CompressionPlugin({
  63 + test: /\.(js|css|html)?$/i, // 压缩文件格式
  64 + filename: '[path].gz[query]', // 压缩后的文件名
  65 + algorithm: 'gzip', // 使用gzip压缩
  66 + threshold: 10240, // 对超过10K的数据压缩
  67 + minRatio: 0.8 // 压缩率小于1才会压缩
  68 + })
  69 + ],
59 }, 70 },
60 chainWebpack(config) { 71 chainWebpack(config) {
61 config.plugins.delete('preload') // TODO: need test 72 config.plugins.delete('preload') // TODO: need test