0

I'm following the ngx-stripe setup doc to use the library and the example shows the publishable key should be added to the import call as a forRoot() like this:

imports: [ 
    NgxStripeModule.forRoot('***your-stripe-publishable-key***'),
]

QUESTION - If I stick this import call into app.modules.ts, how do I switch between my dev and prod key?

I have 2 publishable keys (dev/prod) and when I run it locally on my machine as a dev I want to use the dev key, but when I publish it to the server I want to run the prod key. What code do I need to switch it back and forth depending on my environment?

FYI - Currently the dev/prod keys are in my appsettings.Development.json and appsettings.json files, but I can move them if it's more appropriate for them to be somewhere else.

I see this link that shows how to see if I'm in dev/prod: https://stackoverflow.com/questions/39535386/how-to-check-if-angular-application-running-in-production-or-development-mode#:~:text=Simply%20check%20the%20production%20variable,mode%20and%20false%20for%20development.

chuckd
  • 13,460
  • 29
  • 152
  • 331

1 Answers1

1

This is where you'll want to use the angular environment options during your compilation. This will swap out the values in the environment object based on what configuration you specify.

This does mean that you'll need a build per environment in your CI/CD pipeline. If you have a staging deployment and a production deployment, you'd run the ng build once with the staging configuration set, and once with production configuration set.

then, in your app.module.ts simply swap out to this (assuming you named the property on the environment object 'stripePublishableKey'):

imports: [
  NgxStripeModule.forRoot(environment.stripePublishableKey)
]
ye-olde-dev
  • 1,168
  • 2
  • 17
  • 29