Setting up multiple environment in your angular project

By default angular only creates two environment for you, which are test and production. Sometimes we might need to add more environments to our project, due to company or project structure .It might be a development environment, staging or even a QA environment. In the post I would show you how easy it is to setup up multiple environment file in your angular project .

Step 1

Create a new file in your environments folder. You can name it environment.staging.ts.

Step 2

In your angular.json file add the code below to your configuration key. This allows you register the new environment.

"staging": {
              "fileReplacements": [
                {
                  "replace": "src/environments/environment.ts",
                  "with": "src/environments/environment.staging.ts"
                }
              ]
            },

Step 3

Finally to build this newly created environment type the command below in your terminal.

ng build --configuration staging

Thanks for reading you can follow me on twitter at