升级Angular v13至v14时Angular CLI版本不兼容问题求助

错误信息 #

This version of CLI is only compatible with Angular versions ^13.0.0 || ^13.3.0-rc.0, but Angular version 14.3.0 was found instead.

问题根源分析 #

从你的package.json依赖来看，多处版本不匹配的依赖触发了CLI的v13版本校验逻辑：

• @angular-eslint全系列包仍停留在v13.5.0，该版本专为Angular 13设计，内部携带v13的版本检测规则
• @angular-devkit/architect使用了v15.x版本，与项目中v14的CLI/build-angular版本跨度过大
• ngx-build-plus为v13.0.1，未适配Angular 14环境
• @angular/cdk停留在v12，与v14核心框架版本不兼容

解决步骤 #

1. 统一Angular生态依赖版本 #

修改package.json中的以下依赖版本，确保核心工具链版本一致：

// devDependencies
"@angular-devkit/architect": "~14.2.12",
"@angular-eslint/builder": "~14.0.0",
"@angular-eslint/eslint-plugin": "~14.0.0",
"@angular-eslint/eslint-plugin-template": "~14.0.0",
"@angular-eslint/schematics": "~14.0.0",
"@angular-eslint/template-parser": "~14.0.0",
"@angular/compiler-cli": "~14.2.12",
"@angular/language-service": "~14.2.12",
"ngx-build-plus": "~14.0.0"

// dependencies
"@angular/cdk": "~14.2.12",
"@angular/animations": "~14.2.12",
"@angular/common": "~14.2.12",
"@angular/compiler": "~14.2.12",
"@angular/core": "~14.2.12",
"@angular/forms": "~14.2.12",
"@angular/localize": "~14.2.12",
"@angular/platform-browser": "~14.2.12",
"@angular/platform-browser-dynamic": "~14.2.12",
"@angular/platform-server": "~14.2.12",
"@angular/router": "~14.2.12"

注：将所有Angular核心包统一到~14.2.12，与CLI版本保持对齐，消除小版本差异导致的兼容问题

2. 清理并重新安装依赖 #

执行命令彻底重置本地依赖环境：

rm -rf node_modules package-lock.json
npm install

3. 使用项目本地CLI执行命令 #

避免全局CLI版本干扰，始终调用项目本地的CLI：

npx ng serve

4. 排查第三方工具依赖 #

• 检查@maxxton/build-tools是否存在Angular版本锁定，尝试升级到适配Angular 14的版本
• 验证keycloak-angular（v11.0.0）与Angular 14的兼容性，必要时升级到对应适配版本

额外验证 #

执行npm ls @angular/cli查看项目依赖树，确认没有嵌套的v13版本CLI被引入，若存在可通过npm dedupe清理重复依赖。

内容的提问来源于stack exchange，提问作者Paul van den Dool