升级webpack打包

package.json

@@ -45,6 +45,7 @@
     "sass": "^1.18.0",
     "sass-loader": "^7.1.0",
     "script-ext-html-webpack-plugin": "^2.1.4",
+    "speed-measure-webpack-plugin": "^1.3.3",
     "svg-sprite-loader": "^4.1.6",
     "svgo": "^1.3.0",
     "uglifyjs-webpack-plugin": "^2.2.0",

vue.config.js

@@ -4,7 +4,8 @@ const CompressionWebpackPlugin = require('compression-webpack-plugin')
 const UglifyjsWebpackPlugin = require('uglifyjs-webpack-plugin')
 const HappyPack = require('happypack')
 const PurgecssPlugin = require('purgecss-webpack-plugin')
-// const { BundleAnalyzerPlugin } = require('webpack-bundle-analyzer')
+const SpeedMeasurePlugin = require('speed-measure-webpack-plugin')
+const { BundleAnalyzerPlugin } = require('webpack-bundle-analyzer')
 const port = process.env.port || process.env.npm_config_port || 8888
 const cdnDomian = './' // cdn域名，如果有cdn修改成对应的cdn
 const name = 'H5Vue' // page title
@@ -32,6 +33,9 @@ const PATHS = {
   src: path.join(__dirname, 'src')
 }
 
+// 记录打包速度
+const smp = new SpeedMeasurePlugin()
+
 function resolve (dir) {
   return path.join(__dirname, dir)
 }
@@ -62,7 +66,7 @@ module.exports = {
     },
     after: require('./mock/mock-server.js')
   },
-  configureWebpack: {
+  configureWebpack: smp.wrap({
     // provide the app's title in webpack's name field, so that
     // it can be accessed in index.html to inject the correct title.
     name: name,
@@ -77,7 +81,7 @@ module.exports = {
         style: resolve('src/style') // 通用样式
       }
     }
-  },
+  }),
   chainWebpack (config) {
     config.plugins.delete('preload') // TODO: need test
     config.plugins.delete('prefetch') // TODO: need test
@@ -111,18 +115,18 @@ module.exports = {
       .end()
 
     // 图片压缩
-    config.module
-      .rule('images')
-      .use('image-webpack-loader')
-      .loader('image-webpack-loader')
-      .options({
-        bypassOnDebug: true,
-        pngquant: {
-          quality: [0.75, 0.90],
-          speed: 5
-        }
-      })
-      .end()
+    // config.module
+    //   .rule('images')
+    //   .use('image-webpack-loader')
+    //   .loader('image-webpack-loader')
+    //   .options({
+    //     bypassOnDebug: true,
+    //     pngquant: {
+    //       quality: [0.75, 0.90],
+    //       speed: 5
+    //     }
+    //   })
+    //   .end()
 
     config
       // https://webpack.js.org/configuration/devtool/#development
@@ -162,7 +166,7 @@ module.exports = {
       config.optimization.runtimeChunk('single')
     })
     if (IS_PRODUCTION) {
-      // config.plugin('analyzer').use(BundleAnalyzerPlugin)
+      config.plugin('analyzer').use(BundleAnalyzerPlugin)
       config.plugin('html').tap(args => {
         args[0].cdn = cdn
         return args

yarn.lock

@@ -7683,7 +7683,7 @@ pluralize@^7.0.0:
   resolved "https://registry.npm.taobao.org/pluralize/download/pluralize-7.0.0.tgz#298b89df8b93b0221dbf421ad2b1b1ea23fc6777"
   integrity sha1-KYuJ34uTsCIdv0Ia0rGx6iP8Z3c=
 
-pngquant-bin@^5.0.0:
+pngquant-bin@^5.0.0, pngquant-bin@^5.0.2:
   version "5.0.2"
   resolved "https://registry.npm.taobao.org/pngquant-bin/download/pngquant-bin-5.0.2.tgz#6f34f3e89c9722a72bbc509062b40f1b17cda460"
   integrity sha1-bzTz6JyXIqcrvFCQYrQPGxfNpGA=
@@ -9249,6 +9249,13 @@ spdy@^4.0.1:
     select-hose "^2.0.0"
     spdy-transport "^3.0.0"
 
+speed-measure-webpack-plugin@^1.3.3:
+  version "1.3.3"
+  resolved "https://registry.npm.taobao.org/speed-measure-webpack-plugin/download/speed-measure-webpack-plugin-1.3.3.tgz?cache=0&sync_timestamp=1584922262522&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fspeed-measure-webpack-plugin%2Fdownload%2Fspeed-measure-webpack-plugin-1.3.3.tgz#6ff894fc83e8a6310dde3af863a0329cd79da4f5"
+  integrity sha1-b/iU/IPopjEN3jr4Y6AynNedpPU=
+  dependencies:
+    chalk "^2.0.1"
+
 split-string@^3.0.1, split-string@^3.0.2:
   version "3.1.0"
   resolved "https://registry.npm.taobao.org/split-string/download/split-string-3.1.0.tgz#7cb09dda3a86585705c64b39a6466038682e8fe2"