Angular 12 库源映射不可用

Question

升级到 Angular 12 后，自定义 Angular 库组件的源映射不再可用于调试。

angular.json以下是Angular 应用程序模块的一部分，该模块使用该库：

"projects": {
  "myapp": {
    "build": {
      "configurations": {
        "development": {
          "optimization": false,
          "sourceMap": true,
          "namedChunks": true,
          "extractLicenses": false,
          "vendorChunk": true,
          "buildOptimizer": false,
          "budgets": []
        }
      }
    },
    "serve": {
      "builder": "@angular-devkit/build-angular:dev-server",
      "options": {
        "browserTarget": "myapp:build"
      },
      "configurations": {
        "production": {
          "browserTarget": "myapp:build:production"
        },
        "development": {
          "browserTarget": "myapp:build:development"
        }
      },
      "defaultConfiguration": "development"
    }
  }
}

Answer 1

在这种情况下，简单的设置sourceMap: "true"是不够的。

为了使库源可用，请使用以下内容并设置sourceMap.vendor为true：

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