安装compression-webpack-plugin遇ERESOLVE依赖冲突求解决

我正在尝试减小Phaser游戏的JS文件体积，执行npm安装compression-webpack-plugin时持续报错。

执行的命令： #

• npm install compression-webpack-plugin
• npm install compression-webpack-plugin --save-dev

错误信息： #

PS D:\phaser games\game-slot-machine> npm install compression-webpack-plugin
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: phaser3-project-template@1.1.2
npm ERR! Found: webpack@4.46.0
npm ERR! node_modules/webpack
npm ERR!   dev webpack@"^4.41.2" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer webpack@"^5.1.0" from compression-webpack-plugin@10.0.0
npm ERR! node_modules/compression-webpack-plugin
npm ERR!   compression-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 to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See C:\Users\Cheetay\AppData\Local\npm-cache\eresolve-report.txt for a full report.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\Cheetay\AppData\Local\npm-cache\_logs\2023-01-31T07_37_59_109Z-debug-0.log
PS D:\phaser games\game-slot-machine> npm install compression-webpack-plugin --save-dev
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: phaser3-project-template@1.1.2
npm ERR! Found: webpack@4.46.0
npm ERR! node_modules/webpack
npm ERR!   dev webpack@"^4.41.2" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer webpack@"^5.1.0" from compression-webpack-plugin@10.0.0
npm ERR! node_modules/compression-webpack-plugin
npm ERR!   dev compression-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 to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See C:\Users\Cheetay\AppData\Local\npm-cache\eresolve-report.txt for a full report.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\Cheetay\AppData\Local\npm-cache\_logs\2023-01-31T07_39_20_653Z-debug-0.log

问题根源： #

当前项目使用webpack@4.46.0，而最新版compression-webpack-plugin@10.0.0要求peer依赖为webpack@^5.1.0，版本不匹配导致依赖树解析失败。

解决方案 #

1. 安装兼容Webpack 4的插件版本

compression-webpack-plugin的6.x版本完全兼容Webpack 4，执行以下命令安装指定版本：

npm install compression-webpack-plugin@6.1.1 --save-dev

2. 升级项目Webpack到5.x版本

如果项目允许升级Webpack，可先升级Webpack至符合要求的版本（注意升级可能需要适配其他依赖，建议先备份项目）：

npm install webpack@^5.1.0 --save-dev

升级完成后，再安装最新版插件：

npm install compression-webpack-plugin --save-dev

3. 临时跳过Peer依赖检查（不推荐）

若需临时绕过依赖冲突，可使用--legacy-peer-deps参数，但可能引发潜在兼容性问题：

npm install compression-webpack-plugin --save-dev --legacy-peer-deps

内容的提问来源于stack exchange，提问作者Asad Rahman