How to change constant depending on environment? (or alternative, better solution)


I have several backend services in my project that use different URLs depending on which environment I build for (staging vs. live) and some stuff that I have to proxy for ionic serve.

Right now I solve this by having a constant ApiEndpoint with some properties:

.constant('ApiEndpoint', {
  url: '', // normal
  //url: 'http://localhost:8100/api-test', // ionic serve

But I have to comment these in and out every time I change my environment or swith from ionic serve to testing on an emulator or on a device. Of course I forget this every second time. Lots of rebuilding and changing because of that.

Can I change this constant depending on what I am building for?
Or is there a much better way to solve this problem alltogether? (environment variables, build parameters or something like that)

Thanks for your help.

Have look at generator-m-ionic their environment support in gulp does exactly what you described.

1 Like

Thanks, looks good in theory - in practice it is all a bit too much. They change almost everything and do it their way :confused:

I’d prefer a simple solution just for configuring the config.js I have…

Well, it’s up to you.

Personally I regret that Ionic tools target only the beginners and simple projects, I’m always amazed to see people releasing apps without even minifying their code.

Generator-m-ionic and similar tools can do much more for you.
Their way of doing is based on leveraging what is done for years in front-end dev and that you may already know if you are already using angular for web apps.

Doesn’t mean you have to change your complete project structure and even basic commands like ionic * or cordova * to something completely different. The generator-m-ionic parts are great, but I’ld greatly prefer it if it would be possible just to use the environment stuff for example - and not only if I take all the rest, too.

You might be able to do something with gulp inject, like the following post suggests:

So, have two config.js files, one for dev and one from PROD.

1 Like