Angular从9升级到14后出现‘Module not found Error’问题求助

1. 统一依赖版本 #

• 检查package.json，确保所有@angular/*开头的依赖（如cli、core、common、compiler、platform-browser等）版本完全一致为14.2.12，禁止混合不同版本
• 同步第三方依赖版本：Angular 14要求rxjs版本需在>=6.6.0 <7.0.0范围内（推荐6.6.7），zone.js需为~0.11.4版本

2. 彻底清理并重装依赖 #

执行以下命令完成清理重装：

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

3. 校验配置文件正确性 #

• 检查angular.json中architect/build/options/tsConfig的路径，确保指向项目根目录下的tsconfig.json
• 验证tsconfig.json的compilerOptions.paths配置，确认别名对应的实际路径存在且拼写正确，示例：

  "paths": {
    "@app/*": ["src/app/*"],
    "@env/*": ["src/environments/*"]
  }
  

• 确认tsconfig.json的include列表包含所有需要编译的文件，避免核心代码被错误排除

4. 修复代码导入路径 #

• 排查所有导入语句，确保路径拼写准确（注意区分大小写，Linux/macOS环境下大小写不匹配会直接报错）
• 修正相对路径层级错误，比如../components/xxx需对应实际存在的文件目录
• 确认被导入的模块文件未被误删，且模块的export语句配置正确

5. 补全分步升级流程 #

跨版本直接修改依赖容易出现兼容问题，建议按官方分步升级流程补全：

1. 先升级到Angular 10：ng update @angular/cli@10 @angular/core@10
2. 依次升级到11、12、13版本，每一步执行对应版本的ng update命令
3. 最后升级到14.2.12：ng update @angular/cli@14.2.12 @angular/core@14.2.12

• 升级过程中若第三方库报错，先将其更新到兼容当前Angular版本的版本后再继续

6. 匹配TypeScript版本 #

Angular 14.2.12要求TypeScript版本在4.6.x至4.8.x之间，安装对应版本：

npm install typescript@4.7.4 --save-dev

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