How do I alter Environment .ts Variables or Constants Post Build In Angular 8, host URL and API URL?

Question

I have this code in envrionment.ts

export const environment = {
    production: false,
    host_name: 'http://local.website.com',
    api_name: 'http://local.website.com/api',
    ajax_name: 'http://local.website.com/ajax',
};

Once the app is built, we need to change the environment settings without undergoing another build. Essentially because the web-app is coupled to another website, and the back-end people want to change these settings without running a build. Using the .env root file has been ruled-out as insecure leaving a .json file in the assets folder as the only option. There is another ts file on the app that can read the json with no problem when served but envrionment.ts can not seem to, supposedly because its static. Any help would be appreciated.

You can't use environment.ts file after the build. That file is compiling and bundling into the production file so you need to do the rebuild after changing any value in it. You can refer jvandemo.com/… — Julian W.
– Julian W., Commented May 18, 2021 at 9:41
So even if the data is loaded from a json file, the build will compile this within the app and not a references external file? I was told if the assets folder is completely ignored by the build and this can be used. — t-owens-elas
– t-owens-elas, Commented May 18, 2021 at 10:31
@t-owens-elas you can try stackoverflow.com/questions/43651991/… — noririco
– noririco, Commented May 18, 2021 at 11:32

Onur Özkır · Accepted Answer · 2021-05-18 11:00:36Z

1

At the company I work for now, they adjust the settings via ftp. For this reason, it needs to read the json file and rewrite it every time the client is refreshed.

Follow the instructions in the url I shared. it worked for us.

https://christianlydemann.com/implementing-dynamic-environments-in-angular-for-avoiding-one-build-per-environment/

Edit : maybe you can use specifically created regex records. You can try changing it in main.bundle.js using the fs library belonging to nodejs. like this

export const environment = {
    production: '<<<<PRODUCTION>>>>',
    host_name: '<<<<HOST_NAME>>>>',
    api_name: '<<<<API_NAME>>>>',
    ajax_name: '<<<<AJAX_NAME>>>>',
};

edited May 18, 2021 at 11:00

answered May 18, 2021 at 9:39

Onur Özkır

5453 silver badges13 bronze badges

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

2 Comments

t-owens-elas Over a year ago

Thank you, I did try that, its a legacy build and complicated solutions seem to cause bigger problem. All I really need to do is import the JSON info read by the app using ngInit() (which is does) only I need to import this to envrionment.ts. I think that should do it.

t-owens-elas Over a year ago

Thank you for the edit. Looks like an interesting solution. I am not sure how to alter things like that in Node directly. I will look into it. Any guidance you can give me is also appreciated.

Collectives™ on Stack Overflow

How do I alter Environment .ts Variables or Constants Post Build In Angular 8, host URL and API URL?

1 Answer 1

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related