Angular 构建配置：添加条件文件 (robots.txt)。

Question

我有两个构建配置，分别是"production"和"development"。通过选择以下两个命令之一，我可以决定要为哪个配置构建应用程序：

1. ng build --configuration=development
2. ng build --configuration=production

在angular.json文件中，我会针对每个配置指定构建选项：

        "build": {
          "builder": "@angular-devkit/build-angular:browser",
          "options": {
           .
           .
           .
          },
          "configurations": {
            "production": {
              "fileReplacements": [
                {
                  "replace": "src/environments/environment.ts",
                  "with": "src/environments/environment.prod.ts"
                }
              ],
              "index": {
                "input": "src/index.prod.html",
                "output": "index.html"
              },
              .
              .
              .
            },
            "development": {
              "fileReplacements": [
                {
                  "replace": "src/environments/environment.ts",
                  "with": "src/environments/environment.dev.ts"
                }
              ],
              .
              .
              .
            }
          }
        },

我基本上会根据所选的构建配置更改environment.ts以及index.html。

在项目文件夹中是否有一种方式可以拥有两个robots.txt文件，例如 robots.dev.txt 和 robots.prod.txt ，并在构建期间有条件地将其中一个添加为 robots.txt 至dist文件夹？ 就像我处理索引文件一样。 目的是防止所有搜索引擎机器人索引我的开发构建，但允许它们索引生产构建。

- LukyFoggy

Answer 1

以下是我是如何做到的。

在我的angular.json文件中，我定义了要包含在architect->build->options中的资源：

        "assets": [
          "src/favicon.ico",
          "src/assets",
          "src/robots.txt",
          "src/sitemap.txt"
        ],

- djangofan

Answer 2

我认为这不能从 angular.json 中处理。

作为替代方案，可以将 robots.txt 复制为后置构建步骤。为此， 安装 copy npm 包以使用跨平台的复制 CLI 命令：

npm install copy --save-dev

在 package.json 中添加一个脚本，用以下命令进行生产构建：

"build:prod": "ng build --prod && copy robots.txt dist"

运行npm run build:prod以生成包含robots.txt的生产构建。

上面的示例假设robots.txt与package.json位于同一目录中，并且假设构建后的应用程序位于dist文件夹的根目录中。

更新

如果需要重命名复制的文件，则可以使用copy-file-from-to包。如果来自不同来源的多个文件也需要重命名，则此包特别方便。要在问题的上下文中使用它，请执行以下步骤：

将第三方库安装为开发依赖项：

npm install copy-files-from-to --save-dev

在项目根目录下创建名为 copyFiles.json 的配置文件，用于 copy-files-from-to，其内容如下：

{
    "copyFiles": [
        {
            "from": "robots.dev.txt",
            "to": "dist/robots.txt"
        }
    ]
}

创建一个npm脚本，使用上述配置中的copy-files-from-to。

"build:prod": "ng build --prod && copy-files-from-to --config copyFiles.json"

运行npm run build:prod，在构建后会将robots.dev.txt的内容复制到dist/robots.txt中。

- Milan Tenk

---

谢谢，我会查看这个。在复制过程中是否还有重命名文件的选项？例如copy robots.dev.txt dist robots.txt？ - LukyFoggy

我检查了copy第三方库，但没有找到任何重命名选项。因此，我更新了答案，提供了另一种解决方案，使文件重命名成为可能。 - Milan Tenk

Answer 3

我无法对之前的答案进行评论，因为我有一个新账户。我只想补充两件事。首先：

• 如果您希望文件在不同的环境中具有不同的内容，请使用copy选项。
• 如果您只想在不同的环境中包含/排除某些文件，请使用angular.json选项。

其次，我想通过添加一个更完整的示例来扩展angular.json选项：

"build": {
  "builder": "@angular-devkit/build-angular:browser",
  "options": {
    "assets": [
      "src/favicon.ico",
      "default/assets/for/all/builds"
    ],
    .
    .
    .
  },
  "configurations": {
    "production": {
      "assets": [
        "assets/for/production/build"
      ],
      .
      .
      .
    },
    "development": {
      "assets": [
        "assets/for/development/build"
      ],
      .
      .
      .
    }
  }
}

在构建时指定资产（例如上面的“生产”和“开发”），默认资产（在“选项”下）将不会应用。

- Ernie