angular-cliangular-cli-v7

Angular CLI fileReplacements for default/development


I have a rather complex angular.json because I have multiple projects. What I would like to have is separate environment.ts files per project. Replacing the environment file when the build target is production seems to be pretty straightforward:

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

What I'm looking for is a way to do the same with the default/development configuration. The angular.json does not contain a configuration node for anything like that that I can find and so I'm not sure if it is possible and/or where to specify fileReplacements when not targeting production.

Of course, if there is a better way to handle environments per project that I'm not seeing I would also be interested in that.


Solution

  • I assume with "default/development configuration" you are referring to what is served with the ng serve command.

    Option 1: replace environment files:

    You can specify the fileReplacements array in the build object as well (this one is used for ng serve).

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

    Option 2: specifiy default configuration:

    If you want to serve an already existing configuration withng serve, you can change the serve options:

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

    The important point is to set the build configuration target with :yourConfigName.


    Both options are configured per project and therefore allow you full control.