Angular 5 Use runtime environment variables in app.module.ts

Question

I have a 3rd party module that I am using for authentication- OktaAuthModule.

For it to be imported in my root module (app.module.ts), it needs to first be configured like this-

const config = {
   url: https://myurl.com/
}

@NgModule({
   declarations: [ ... ],
   imports: [
      OktaAuthModule.initAuth(config),
   ],
   ...
});

I need to produce a single build that can be deployed to multiple runtimes, each having a different config for this module.

Using the built-in "ng build --env " works fine, but requires multiple builds. The APP_INITIALIZER hooks seem to run after this "imports" array has been processed.

I was hoping to make an API call that could pull this information each time the app is deployed. I don't have any idea where I can add this code in the app.module.ts file?

Thanks in advance for any advice / suggestions.

you could check out this answer here for an alternative method that loads a runtime config: stackoverflow.com/questions/48346515/… — bryan60
– bryan60, Commented Oct 15, 2018 at 17:37
@bryan60 I have something implemented very close to this (using APP_INITIALIZER). How would I be able to use that from the app.module.ts file? — Max Friederichs
– Max Friederichs, Commented Oct 15, 2018 at 18:56

Antoniossss · Accepted Answer · 2018-10-15 17:01:13Z

1

I came across similar issue when co figuring Bamboo deployment plans for different environments. Every env had to had dedicated build. I didnt like that much so I have ended up in automated editing of main.js. Environment variables are embedded there so you could modify that per enc just like I did.

answered Oct 15, 2018 at 17:01

Antoniossss

32.7k7 gold badges67 silver badges119 bronze badges

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

1 Comment

Max Friederichs Over a year ago

Thanks for the comment.. I also had the thought of attaching variables to window through a file written out by my backend. I was hoping for a more elegant approach but I definitely I will fallback on this

Collectives™ on Stack Overflow

Angular 5 Use runtime environment variables in app.module.ts

1 Answer 1

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related