新增gzip压缩

build/webpack.prod.conf.js

@@ -10,6 +10,7 @@ const HtmlWebpackPlugin = require('html-webpack-plugin')
 const ExtractTextPlugin = require('extract-text-webpack-plugin')
 const OptimizeCSSPlugin = require('optimize-css-assets-webpack-plugin')
 const UglifyJsPlugin = require('uglifyjs-webpack-plugin')
+const CompressionPlugin = require('compression-webpack-plugin');//引入gzip压缩插件
 
 const env = require('../config/prod.env')
 
@@ -41,6 +42,15 @@ const webpackConfig = merge(baseWebpackConfig, {
       sourceMap: config.build.productionSourceMap,
       parallel: true
     }),
+    new CompressionPlugin({ 
+        filename: '[path].gz[query]', //  使得多个.gz文件合并成一个文件，这种方式压缩后的文件少，建议使用
+        algorithm: 'gzip', // 官方默认压缩算法也是gzip
+        test: /\.js$|\.css$|\.html$|\.ttf$|\.eot$|\.woff$/, // 使用正则给匹配到的文件做压缩，这里是给html、css、js以及字体（.ttf和.woff和.eot）做压缩
+        threshold: 10240, //以字节为单位压缩超过此大小的文件，使用默认值10240吧
+        minRatio: 0.8, // 最小压缩比率，官方默认0.8
+        //是否删除原有静态资源文件，即只保留压缩后的.gz文件，建议这个置为false，还保留源文件。以防：
+        deleteOriginalAssets: false
+    }),
     // extract css into its own file
     new ExtractTextPlugin({
       filename: utils.assetsPath('css/[name].[contenthash].css'),

package-lock.json

@@ -2078,6 +2078,19 @@
         }
       }
     },
+    "compression-webpack-plugin": {
+      "version": "1.1.11",
+      "resolved": "https://registry.npmmirror.com/compression-webpack-plugin/-/compression-webpack-plugin-1.1.11.tgz",
+      "integrity": "sha512-ZVWKrTQhtOP7rDx3M/koXTnRm/iwcYbuCdV+i4lZfAIe32Mov7vUVM0+8Vpz4q0xH+TBUZxq+rM8nhtkDH50YQ==",
+      "dev": true,
+      "requires": {
+        "cacache": "^10.0.1",
+        "find-cache-dir": "^1.0.0",
+        "neo-async": "^2.5.0",
+        "serialize-javascript": "^1.4.0",
+        "webpack-sources": "^1.0.1"
+      }
+    },
     "concat-map": {
       "version": "0.0.1",
       "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",

package.json

@@ -49,6 +49,7 @@
     "babel-preset-env": "^1.3.2",
     "babel-preset-stage-2": "^6.22.0",
     "chalk": "^2.0.1",
+    "compression-webpack-plugin": "^1.1.11",
     "copy-webpack-plugin": "^4.0.1",
     "css-loader": "^0.28.0",
     "extract-text-webpack-plugin": "^3.0.0",