CODEWITHSUNDEEP
angularangular-cli
Anoop Sankar
Anoop Sankar

Reputation: 659

How to edit environment variables without rebuild in Angular 6?

I usually set my API URLs in environment.ts file. I have to deploy the same build to multiple clients with different API URLs. Currently I am taking separate builds after changing the environment variables.

Is there any way to edit environment variables after build, so I can give the same build to each client?

Upvotes: 14

Views: 8872

Answers (1)

Hien Nguyen
Hien Nguyen

Reputation: 18975

I researched this issue and this is my solution without using environment.ts

I defined global settings in json file. Because if we defined in ts file, if build in production mode it is not easy to find constants to change value.

export class SettingService  {

  constructor(private http: HttpClient) {

  }



public getJSON(file): Observable<any> {
      return this.http.get("./assets/configs/" + file + ".json");
  }
  public getSetting(){
      // use setting here
  }
}

In app folder, i add folder configs/setting.json

Content in setting.json

{
    "baseUrl": "http://localhost:52555"
}

In app module add APP_INITIALIZER

 {
      provide: APP_INITIALIZER,
      useFactory: (setting: SettingService) => function() {return setting.getSetting()},
      deps: [SettingService],
      multi: true
    }

with this way, I can change baseUrl value in json file easier.

Upvotes: 12

Related Questions