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 中添加以下内容(文件替换部分):

      "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 用于索引文件。