如何生成带源图和不带源图的优化源以供生产使用？

Question

我正在尝试使用 sourceMaps 来解决 Angular 中生产错误的堆栈跟踪。

我想从

dist/*

生成的

ng build --configuration=production

发送优化源，显然没有生成

`

.js.map

文件。同时，我想生成/使用 `*.js.map` 源来解析生产堆栈跟踪。

但是，我不想编写自定义脚本来在构建完成后从 dist 目录中删除 `*.js.map`，因为这很容易出错。

我想我可以分两步完成：

1. 生成生产源而无需源映射。然后将其运送到生产

2. 如果发生生产错误：重新生成生产块。这次包括源地图。

我现在面临的问题是生成的

.js

具有不同的哈希值。我使用

"hidden": true

从生成的文件中删除

sourceMappingUrl

。我希望隐藏字段会阻止文件内容/哈希值发生更改。我错过了什么？

https://angular.dev/reference/configs/workspace-config#source-map-configuration

生产编译的生产配置：

"production": {
              "fileReplacements": [
                {
                  "replace": "src/environments/environment.ts",
                  "with": "src/environments/environment.prod.ts"
                }
              ],
              "optimization": true,
              "outputHashing": "all",
              "sourceMap": { 
                "scripts": false,
                "styles": false, 
                "hidden": true, 
                "vendor": false 
              },
              "namedChunks": false,
              "aot": true,
              "extractLicenses": true,
              "vendorChunk": false,
              "buildOptimizer": true,
              "budgets": [
                {
                  "type": "initial",
                  "maximumWarning": "2mb",
                  "maximumError": "5mb"
                }
              ]
            },

为了生成源映射，我使用相同的配置，仅更改 sourceMap 配置，如下所示：

              "sourceMap": { 
                "scripts": true,
                "styles": true, 
                "hidden": true, 
                "vendor": false 
              },

生成的输出不同，例如

59.10d4343a556f9106.js |组件 1 模块 | 4.41 KB | 1.61 kB

59.e2a4f51b3ab8de9e.js |组件 1 模块 | 4.41 KB | 1.63 kB

使用

"@angular/cli": "^17.3.8",

Answer 1

通常有一个副本环境，其中有生产数据库的克隆，您可以在其中运行启用了 sourceMaps 的构建并查看更改。

CI 无法知道发生了生产错误，您可以从本地指向生产环境调试问题，或者使用 kubernetes 将启用了 Sourcemap 的构建热交换到生产环境，调试它，然后在没有 Sourcemap 版本的情况下将其交换回来。

无论如何，这个过程都无法自动化，但可以使用 kuberenetes 进行热插拔，这样生产用户就不会遇到任何停机时间。