Angular 6.4.1 配置无法替换 index.html 文件

Question

因此尝试执行“ng build --configuration=production”并尝试让它使用我的 angular.json 中的 FileReplacements 将 /src 文件夹下的 index.html 文件替换为我的生产版本。我看到它正在正确替换环境 ts 文件。

使用以下版本：

"@angular/animations": "^8.0.0-beta.12",
"@angular/cdk": "~7.3.7",
"@angular/common": "^8.0.0-beta.12",
"@angular/compiler": "^8.0.0-beta.12",
"@angular/core": "^8.0.0-beta.12",
"@angular/forms": "^8.0.0-beta.13",
"@angular/material": "^7.3.7",

在我的常规 index.html 中，我有：

<base href="/">

但在我的 index.prod.html 文件中，我有：

<base href="/CSRTest/#/">

我在构建后看到 dist 文件夹中的常规 index.html 文件，而不是被替换的文件。

这是我的 angular.json sn-p：

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

如果有人对如何为不同环境（prod、qa 等）创建自定义 index.html 文件有任何想法，将不胜感激。谢谢！

Answer 1

我发现将环境和索引文件放在单独的目录（PRODUCTION、QA 等）中，然后在我的 angular.json 中这样做修复了它：

  "configurations": {
    "production": {
      "fileReplacements": [
        {
          "replace": "src/environments/environment.ts",
          "with": "src/environments/PRODUCTION/environment.ts"
        }
      ],
      "index": "src/environments/PRODUCTION/index.html",

然后运行“ng build --configuration=production”就可以了。

谢谢大家！

Answer 2

您可以尝试此解决方法，将 index.html 设置为您的 prod 环境的输出。

"production": {
  "index": {
    "input": "src/index.prod.html",
    "output": "index.html"
  }
}