不同客户配置的Dev/Prod环境

Question

角工作区配置指南的建造Config剖面讨论了如何在同一个应用程序中管理各种配置。

在我的例子中，我决定为每个客户创建一个配置：

// angular.json excerpt
"architect": {
    "build": {
        "configurations": {
            "customer-1": {
                "fileReplacements": [
                    {
                    "replace": "src/environments/environment.ts",
                    "with": "src/environments/environment.customer-1.ts"
                    }
                ]
            },
            "customer-2": {
                "fileReplacements": [
                    {
                    "replace": "src/environments/environment.ts",
                    "with": "src/environments/environment.customer-2.ts"
                    }
                ]
            },
        }
    },
    "serve": {
        "builder": "@angular-devkit/build-angular:dev-server",
        "configurations": {
            "customer-1": {
                "browserTarget": "my-app:build:customer-1"
            },
            "customer-2": {
                "browserTarget": "my-app:build:customer-2"
            },
}

我使用环境文件来管理各种特定于客户的设置和production标志：

// environment.customer-1.ts excerpt
const environment = {
  production: true,
  customer: "Customer 1",
};


// environment.customer-2.ts excerpt
const environment = {
  production: true,
  customer: "Customer 2",
};

最后，我需要一种方法来确定应用程序是使用ng serve还是使用ng build命令启动的，以便在应用模块中导入一些模拟的提供程序。

我尝试使用environment.production标志，但很明显，它总是正确的：

import { environment } from '../environments/environment';

@NgModule({
  providers: [
    environment.production // is always true since I've set the flag in all customer-specific environment.ts files
       ? []
       : nonProductionProviders,
  ],
  bootstrap: [AppComponent]
})
export class AppModule { }

我想出的唯一支持这个场景的方法是创建单独的environment.ts文件以及匹配信任。

• /src/environment.customer-1-dev.ts
• /src/environment.customer-1-prod.ts

// angular.json excerpt
"architect": {
    "build": {
        "configurations": {
            "customer-1-dev": {
                "fileReplacements": [
                    {
                    "replace": "src/environments/environment.ts",
                    "with": "src/environments/environment.customer-1-dev.ts"
                    }
                ]
            },
            // etc.

有更好的方法吗？传递额外的标志或至少扩展配置的能力将是很好的。

Answer 1

我认为你现在拥有的是最好的方法。环境文件用于编译时已经知道的配置，这正是您的场景。

还可以有一个脚本在运行use ng serve之前修改ng serve文件中的值，但是您可能会错误地将修改后的文件复制到git上。

您还可以使用一些动态的json配置(修改后的构建)，在引导应用程序查看是否使用了build或serve之前，您可以通过http调用检索该配置，但对于您的情况来说，这可能是过分的。

目前无法从angular.json文件扩展配置。有一个特征请求可能会让很多人满意，但我认为它还没有开始工作。