Angular项目编译失败求助：模块构建与fileName读取错误

报错详情 #

构建信息：Build at: 2022-09-14T11:34:20.503Z - Hash: c51f599b4586fb6d - Time: 7780ms
./src/main.ts 报错：模块构建失败（来自 ./node_modules/@ngtools/webpack/src/ivy/index.js）：Error: Emit
./src/polyfills.ts 报错：模块构建失败（来自 ./node_modules/@ngtools/webpack/src/ivy/index.js）：Error: Emit
核心错误：Angular编译初始化失败 - 无法读取null的'fileName'属性
** Angular Live Development Server 正在监听localhost:4200，请在浏览器打开http://localhost:4200/ **
× 编译失败

排查与解决步骤 #

• 清理缓存并重装依赖

  1. 执行命令清理npm缓存：npm cache clean --force
  2. 删除项目根目录下的node_modules文件夹、package-lock.json文件
  3. 重新安装依赖：npm install

• 校验Angular包版本兼容性

  1. 执行ng version查看CLI及核心包版本
  2. 确保所有@angular/*开头的包版本完全一致，版本不匹配会触发编译异常
  3. 若存在版本差异，执行ng update @angular/cli @angular/core升级到稳定兼容版本（操作前建议备份项目）

• 排查代码/模板语法错误

  1. 该核心错误通常源于某组件的TS文件或模板存在语法问题，导致编译器无法识别文件
  2. 检查最近修改的组件、模块，重点排查模板中的未闭合标签、错误绑定、插值表达式，以及TS文件中的语法错误
  3. 通过注释新增代码的方式，逐步定位问题文件

• 重置编译器配置

  1. 检查tsconfig.json和angular.json中的配置项，确认路径、编译参数无错误
  2. 临时将angular.json中build配置下的aot设为false，重新编译以获取更具体的错误提示
  3. 若启用Ivy，确认tsconfig.json中angularCompilerOptions配置无冲突

• 重启服务与IDE

  1. 终止当前开发服务器（Ctrl+C），重新执行ng serve
  2. 重启IDE，避免IDE缓存的错误状态影响编译

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