报错详情
今天在安装 uglifyjs-webpack-plugin 时出现下面的错误：
D:\v3_workspace_personal\blog_client_v4>npm install uglifyjs-webpack-plugin --save-dev npm ERR! code ERESOLVE npm ERR! ERESOLVE unable to resolve dependency tree npm ERR! npm ERR! While resolving: blog_client_v4@1.0.0 npm ERR! Found: webpack@5.76.2 npm ERR! node_modules/webpack npm ERR! dev webpack@"^5.75.0" from the root project npm ERR! npm ERR! Could not resolve dependency: npm ERR! peer webpack@"^4.0.0" from uglifyjs-webpack-plugin@2.2.0 npm ERR! node_modules/uglifyjs-webpack-plugin npm ERR! dev uglifyjs-webpack-plugin@"*" from the root project npm ERR! npm ERR! Fix the upstream dependency conflict, or retry npm ERR! this command with --force or --legacy-peer-deps npm ERR! to accept an incorrect (and potentially broken) dependency resolution. npm ERR! npm ERR! npm ERR! For a full report see: npm ERR! C:\Users\FENG\AppData\Local\npm-cache\_logs\2023-03-21T22_58_27_729Z-eresolve-report.txt npm ERR! A complete log of this run can be found in: npm ERR! C:\Users\FENG\AppData\Local\npm-cache\_logs\2023-03-21T22_58_27_729Z-debug-0.log
- 这是由于uglifyjs-webpack-plugin社区已失去维护，webpack5已经不支持了。
解决方案一：
1. 安装 terser-webpack-plugin
npm install terser-webpack-plugin -D
2. 引入 terser-webpack-plugin
const TerserWebpackPlugin = require("terser-webpack-plugin")
3. 使用
optimization: { minimize: true, minimizer: [ ... new TerserWebpackPlugin() ... ] },
解决方案二
修改 webpack.config.js
optimization: { minimize: true, minimizer: [ // 在 webpack@5 中，你可以使用 `...` 语法来扩展现有的 minimizer（即 `terser-webpack-plugin`），将下一行取消注释 `...`, ] },
其实webpack5 已经自带了terser-webpack-plugin 插件，使用上面的方式启用一下亦可。
