Angular 13中@angular-devkit/build-angular安装及依赖冲突解决

冲突原因 #

你配置的@angular/compiler-cli版本范围是~13.2.0，npm安装时会拉取该范围内的最新版本13.2.7，而它要求peer依赖@angular/compiler@13.2.7；同时@angular-devkit/build-angular因为版本范围~13.2.5被自动升级到13.2.6，虽然它兼容compiler-cli@^13.0.0，但compiler-cli@13.2.7和你项目中现有@angular/compiler版本不匹配，导致冲突。

解决方案 #

1. 统一核心工具包版本（推荐） #

Angular生态的工具包版本必须对齐，尤其是@angular/cli、@angular-devkit/build-angular、@angular/compiler-cli这几个核心包，直接把它们的版本范围改成一致的：

"devDependencies": {
  "@angular-devkit/build-angular": "~13.2.5",
  "@angular/cli": "~13.2.5",
  "@angular/compiler-cli": "~13.2.5",
  // 其他依赖保留原有配置
}

修改后执行npm install即可，npm会拉取同小版本的兼容包，自动解决peer依赖冲突。

2. 精确匹配compiler与compiler-cli版本 #

如果不想升级compiler-cli，先查看当前项目中@angular/compiler的具体版本：

npm list @angular/compiler

得到版本号后，把@angular/compiler-cli的版本改成和它完全一致的数值（比如compiler是13.2.0，就把compiler-cli设为13.2.0），同时把@angular-devkit/build-angular锁定为具体版本13.2.5（去掉~），避免npm自动升级到更高小版本：

"devDependencies": {
  "@angular-devkit/build-angular": "13.2.5",
  "@angular/cli": "~13.2.5",
  "@angular/compiler-cli": "13.2.0",
  // 其他依赖保留原有配置
}

这样整个依赖链的版本就完全兼容了。

3. 临时忽略冲突（不推荐长期使用） #

如果需要快速完成安装，可以执行以下命令跳过peer依赖检查：

npm install --legacy-peer-deps

但这只是临时方案，后续可能引发其他兼容性问题，建议优先用前两种方法彻底解决。

如何确定兼容的devkit版本 #

Angular官方的工具包版本是严格绑定的：

• @angular-devkit/build-angular的版本必须和@angular/cli完全一致
• @angular/compiler-cli的版本必须和项目中@angular/core、@angular/compiler的版本完全一致
  只要遵循这两个规则，就能确保所有工具包版本兼容。

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