1. Run the following command to install the webpack-parallel-uglip-plugin plugin:
npm i -D webpack-parallel-uglify-plugin
Copy the code
2. Configure the code in webpack.prod.conf.js as follows:
// ParallelUglifyPlugin const ParallelUglifyPlugin = require('webpack-parallel-uglify-plugin'); module.exports = { plugins: [// ParallelUglifyPlugin] new ParallelUglifyPlugin({UglifyJS: {output: {/* Whether to output readable code, i.e. to keep Spaces and tabs, defaults to output, and can be set to false for better compression */ beautify: False */ comments: false}, /* Comments: {/* Whether to print warnings when UglifyJS deletes code that is not used. The default value is output. False, /* Whether to delete all console statements */ drop_console: / collapse_vars (x = 1, y = 5, y = 5, x = 1, y = 5) If true, / * extraction appeared many times but not defined as a variable to reference the static values, such as the x = 'XXX'; y = 'XXX' into the var a = 'XXXX'; x = a; y = a; False */ reduce_vars: true}}, uglifyJS: {}, test: /.js$/g, include: [], exclude: [], cacheDir: '', workerCount: '', sourceMap: false }), ] }Copy the code
When instantiated by New ParallelUglifyPlugin(), the following parameters are supported:
/.js$/. Include: use regular to include files compressed by ParallelUglifyPlugin. Default: []. Exclude: use regular to include files compressed by ParallelUglifyPlugin. Use regex to exclude files compressed by ParallelUglifyPlugin. The default is []. CacheDir: To cache the compressed result and return it directly from the cache the next time the same input is encountered. Caching is not enabled by default. Set a directory path to enable caching.
**workerCount: ** Start several subprocesses to perform concurrent compression. The default is the number of CPU cores currently running on the computer minus 1. **sourceMap: ** Whether to generate the corresponding Source Map for the compressed code. By default, this Map is not generated, which will greatly increase the time consumption. Generally, the sourceMap of the compressed code will not be sent to the web user’s browser. UglifyJS: used to compress ES5 code configuration, Object type, directly passed to uglifyJS parameters. UglifyES: used to compress ES6 code. The Object type is directly passed to uglifyES.
You are now done with the plug-in!
Packing only to find an error!
building for production… E:\Myjob\project\git\ digital traffic \v2\szjt-ui\node_modules\[email protected]@webpack-parallel- uglip-plugin \ I ndex.js:29 compiler.hooks.compilation.tap(“ParallelUglifyPlugin”, (compilation) => { ^ TypeError: Cannot read property ‘compilation’ of undefined…
After baidu tried to find their own webpack version of the problem!
This project webpack version “webpack”: “^3.6.0”,
There are two ways to resolve this error:
1. Upgrade webPack to 4.0
2. Install webpack-parallel-uglify-plugin version 1.1.0(original version 2.0)
npm i [email protected] -D
I feel that upgrading the Webpack version is too tedious, and I am afraid that it will cause a series of problems. Therefore, the project uses the second method, packaging is OK!
Refer to www.cnblogs.com/tugenhua070…