1、打包优化

vue.config.js

@@ -3,8 +3,9 @@ const path = require('path')
 const rm = require('rimraf')
 const defaultSettings = require('./src/settings.js')
 const CompressionWebpackPlugin = require('compression-webpack-plugin')
-// const TerserPlugin = require('terser-webpack-plugin')
+const TerserPlugin = require('terser-webpack-plugin')
 const webpack = require('webpack')
+const WebpackBar = require('webpackbar')
 
 function resolve(dir) {
   return path.join(__dirname, dir)
@@ -105,7 +106,33 @@ module.exports = {
         'staticPub': resolve('public')
       }
     },
-    devtool: '#eval-source-map',
+    // TODO: 打包时打开--start
+    cache: {
+      type: 'filesystem',
+      allowCollectingMemory: true
+    },
+    devtool: 'none', // 打包需要开启 '#eval-source-map'
+    optimization: {
+      minimize: true,
+      minimizer: [
+        new TerserPlugin({
+          cache: true,
+          sourceMap: false,
+          parallel: true, //  使用多进程并发运行以提高构建速度 Boolean|Number 默认值： true
+          terserOptions: {
+            compress: {
+              drop_console: true, // 移除所有console相关代码；
+              drop_debugger: true, // 移除自动断点功能；
+              pure_funcs: ["console.log", "console.error"], // 配置移除指定的指令，如console.log,alert等
+            },
+            format: {
+              comments: false, // 删除注释
+            },
+          },
+          extractComments: false, // 是否将注释剥离到单独的文件中
+        })
+      ]
+    },
     plugins: [// 压缩代码
       new CompressionWebpackPlugin(
         {
@@ -113,50 +140,23 @@ module.exports = {
           algorithm: 'gzip',
           test: /\.js$|\.html$|\.json$|\.css/,
           threshold: 0, // 只有大小大于该值的资源会被处理
-          minRatio: 0.4, // 只有压缩率小于这个值的资源才会被处理
-          deleteOriginalAssets: false // 删除原文件 ,需要nginx配置支持
+          minRatio: 0.8, // 只有压缩率小于这个值的资源才会被处理
+          deleteOriginalAssets: false // 删除原文件
         }
       ),
-      new webpack.ProvidePlugin(
-        {
-          $: 'jquery',
-          jQuery: 'jquery',
-          'windows.jQuery': 'jquery'
-        }
-      )
-      // ,
-      // new TerserPlugin({
-      //   cache: true, // 降低版本号后增加
-      //   sourceMap: false, // 降低版本号后增加
-      //   // 多进程
-      //   parallel: true, // 降低版本号后增加
-      //   terserOptions: {
-      //     ecma: undefined,
-      //     warnings: false,
-      //     parse: {},
-      //     compress: {
-      //       drop_console: true,
-      //       drop_debugger: true,
-      //       pure_funcs: ['console.log'] // 移除console
-      //     }
-      //   }
-      // })
+      new webpack.ProvidePlugin({
+        $: 'jquery',
+        jQuery: 'jquery',
+        jquery: 'jquery',
+        'windows.jQuery': 'jquery'
+      }),
+      new WebpackBar({
+        color: '#85d', // 默认green，进度条颜色支持HEX
+        basic: false, // 默认true，启用一个简单的日志报告器
+        profile: false // 默认false，启用探查器。
+      })
     ]
-    // optimization: {
-    //   minimize: true, // 确保最小化是开启的（默认在生产模式下是开启的）
-    //   minimizer: [
-    //     new TerserPlugin({
-    //       terserOptions: {
-    //         compress: {
-    //           warnings: false,
-    //           drop_console: true,
-    //           drop_debugger: true,
-    //           pure_funcs: ['console.log']
-    //         }
-    //       }
-    //     })
-    //   ]
-    // }
+    // TODO: 打包时打开--end
 
   },