Angular 12升级后TypeScript源码映射(source maps)丢失求助

• 修正 angular.json 中 sourceMap 的完整配置
  Angular 12 开始 sourceMap 支持精细化配置，仅设为布尔值可能无法覆盖所有场景，建议将 development 配置下的 sourceMap 改为对象格式，开启 vendor 源映射：

"development": {
  "buildOptimizer": false,
  "optimization": false,
  "vendorChunk": true,
  "extractLicenses": false,
  "sourceMap": {
    "scripts": true,
    "styles": true,
    "vendor": true
  },
  "namedChunks": true
}

• 检查 tsconfig.app.json 配置
  确保配置文件中开启了 sourceMap 生成：

{
  "compilerOptions": {
    "sourceMap": true,
    // 其余配置保持不变
  }
}

• 验证 FireFox 调试器配置
  打开 FireFox 调试器面板，点击右上角齿轮设置按钮，确认以下选项已勾选：
  • 启用 JavaScript 源映射
  • 显示原始源
• 清理缓存后重新运行
  执行以下命令清理残留缓存后再启动服务：

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

• 排查依赖版本匹配问题
  确保项目中@angular/cli和@angular-devkit/build-angular的大版本完全一致，避免跨版本兼容问题，可通过npm ls @angular/cli @angular-devkit/build-angular命令校验版本。

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