Angular项目执行ng serve与npm install报错求助

问题根源 #

你的项目存在严重的Angular版本不匹配问题：项目中使用了Angular 16的@angular/compiler-cli，但同时依赖了仅支持Angular 10的@angular-devkit/build-angular@0.1002.1，导致依赖冲突。加上用--legacy-peer-deps强制安装后，部分依赖包未正确安装，引发模块缺失错误。

分步解决步骤 #

1. 彻底清理现有依赖残留

打开项目根目录的终端，执行以下命令：

# Windows系统删除node_modules
rmdir /s/q node_modules
# 删除锁文件
del package-lock.json
# 清理npm缓存
npm cache clean --force

Mac/Linux系统替换为：

rm -rf node_modules
rm package-lock.json
npm cache clean --force

2. 修正package.json的依赖版本

打开项目根目录的package.json，将所有Angular相关依赖的版本统一为Angular 16.x：

• 所有@angular/xxx包（如@angular/core、@angular/compiler-cli等）版本改为^16.2.0
• 将@angular-devkit/build-angular的版本改为^16.2.0（与Angular主版本严格匹配）

修改后的核心依赖示例：

"devDependencies": {
  "@angular-devkit/build-angular": "^16.2.0",
  "@angular/cli": "^16.2.0",
  "@angular/compiler-cli": "^16.2.0"
}

3. 重新安装依赖

在终端执行：

npm install

版本统一后无需添加--legacy-peer-deps，依赖会正常解析安装。

4. 验证并启动项目

• 先确认版本一致性：

  npx ng version
  

  确保所有Angular包的版本一致且为16.x。
• 启动项目：

  ng serve
  

额外建议（针对新创建项目） #

如果是从头创建Angular应用，先对齐全局CLI版本：

# 卸载旧版本全局CLI
npm uninstall -g @angular/cli
# 安装Angular 16版本的CLI
npm install -g @angular/cli@^16.2.0
# 创建新项目
ng new first-app-lesson-00

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