Angular 6 - 構建時修改 index.html 文件引用路徑

Question

在構建 angular 6 應用程序時，會生成腳本文件和 css 文件。 所有文件最后都有散列值。

是否可以修改這些文件的 index.html 鏈接？ 路徑始終是本地文件，但如果我將它們上傳到某個服務器上，我想例如添加一個我在 environment.prod.json 中的自定義變量 url。

Answer 1

是的，您可以為每個環境創建自定義 index.html（例如 index.prod.html）：

在您的src文件夾中創建另一個 index.html (index.prod.html) 副本，包括該環境的該索引中所需的任何自定義鏈接，並在 angular.json 中添加以下內容（fileReplacement 部分）：

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

請注意，此選項已修復並在 Angular 6.1 上工作，之前您無法將fileReplacements用於索引文件。

Answer 2

按照angular 8版本的@Mark Uretsky 回答，您不應該使用 fileReplacements。

請使用這個：

      "index": {
        "input": "src/index.prod.html",
        "output": "index.html" // specify the path you want index.html to be generated.
      }