In Angular, how to manually edit environment variables after build?

Question

I store the API base address in my environment class, and it gets reflected into the bundles after build. What i need is a way to somehow liberate this value from the build process so in case i wanna deploy the app under different servers with different API addresses, I won't have to do another build only for the sake of a new URL. My app is quite hefty and the build is really time-consuming.

Here is what is have in my environment.prod.ts :

export const environment = {
  production: true,
  configName: 'prod',
  baseUrl: 'https://mpisitweb1/api'
};

acandylevey · Accepted Answer · 2018-09-27 02:39:00Z

2

I would try creating an environment.json that sits under your assets folder and make it publicly available. When your application is starting I'd do a request (On the same URL your serving from) to download that file which would contain the API baseUrl.

You'd have to store the value in Angular somewhere different though as you can't override the environment variable, might be best off putting it in a service somewhere that can be injected into the http Interceptor that way you can just specify "{BASE_URL}" as your base point and have the interceptor change it out to what's needed so the rest of your app isn't aware.

answered Sep 27, 2018 at 2:39

acandylevey

3262 silver badges14 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Siavash Rostami Over a year ago

thank you, this sounds like the way to follow. i'll create a service to serve the url to all places which make use of it. and feed the service from the static json.

Collectives™ on Stack Overflow

In Angular, how to manually edit environment variables after build?

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related