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

ionic-v1
1

Hey,

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: 'http://api.example.com', // 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.

2

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

1 Like
3

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…

4

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.

5

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.

6

You might be able to do something with gulp inject, like the following post suggests: http://www.thomasmaximini.com/2015/02/10/speeding-up-ionic-app-development-with-gulp.html

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

1 Like