浏览器中缺少 Angular 12 源映射

Question

我们最近升级到Angular 12并面临浏览器源映射丢失的问题，因此我们无法调试我们的组件文件，因为没有任何组件文件。谁能建议我缺少什么？

Answer 1

Angular 12 更改了默认的“ng build”以使用“production”配置。你想要“sourceMap”，所以尝试在你的 angular.json 中添加一个“开发”配置，就像这样

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

使用“ng build -c development”作为目标，或者更改“ng serve”的默认配置，例如。

"serve": {
  "builder": "@angular-devkit/build-angular:dev-server",
  "options": {
    "browserTarget": "app:build"
  },
  "configurations": {
    "production": {
      "browserTarget": "app:build:production"
    },
    "development": {
      "browserTarget": "app:build:development"
    }
  },
  "defaultConfiguration": "development"
},

Answer 2

请在 angular.json 中的 architor -> build-> options 下添加： "sourceMap":true 和 "optimization":false 。

不要忘记以相反的方式为您的生产配置设置这些。