Angular default/development 的 CLI 文件替换

Question

我有一个相当复杂的 angular.json 因为我有多个项目。我想要的是每个项目单独的 environment.ts 个文件。当构建目标是生产时替换环境文件似乎非常简单：

"configurations": {
  "production": {
    "fileReplacements": [
      {
        "replace": "src/environments/environment.ts",
        "with": "src/private-label/redacted/environments/environment.prod.ts"
      }
    ],
  }
}

我正在寻找的是一种对 default/development 配置执行相同操作的方法。 angular.json 不包含我能找到的类似任何东西的配置节点，因此我不确定是否可以 and/or 在不针对生产时指定 fileReplacements 的位置。

当然，如果有更好的方法来处理我没有看到的每个项目的环境，我也会对此感兴趣。

Answer 1

我假设 "default/development configuration" 你指的是 ng serve 命令提供的内容。

选项 1：替换环境文件：

您也可以在 build 对象中指定 fileReplacements 数组（这个用于 ng serve）。

  "build": {
    "options": {
      [...]
      "fileReplacements": [
        {
          "replace": "src/environments/environment.ts",
          "with": "src/environments/environment.development.ts"
        }
      ]      
    },
    "configurations": {
      // other - non default - configurations 
    }
  }

选项 2：指定默认配置：

如果您想使用 ng serve 提供已经存在的配置，您可以更改 serve 选项：

  "configurations": {
    "youConfigName": {
      // config details here
    }
  },
  [...]
  "serve": {
    "options": {
      "browserTarget": "name-of-your-app:build:youConfigName"
    }
  }

重要的一点是使用:yourConfigName设置构建配置目标。

这两个选项都是针对每个项目配置的，因此您可以完全控制。

Answer 2

@jowey 的答案有效，但对 Angular 8 有一个小的扩展。我不得不在 url 前面加上 ./

"replace": "./src/environments/environment.ts", "with": "./src/environments/environment.development.ts"

Answer 3

此外，请务必对 start/serve 您的应用执行正确的命令。就我而言，我使用 Azure Pipelines 部署到 Azure App Service，命令是：

请注意，“--configuration=production”是强制性的，以实现文件替换。

我还将“fileReplacements”部分放在：angular.json 文件的“build”和“configuration”部分：

Angular default/development 的 CLI 文件替换

Angular CLI fileReplacements for default/development

angular-cli

angular-cli-v7