web applications - Set Env variables based on grunt task -

i have webapp (emberjs) need set env variables based on grunt task. when run grunt server choose development, , url set localhost:5000. when grunt build, choose production , url set production.com.

the main issue me is, how read variables ember. or how make grunt variable , change based on task

is possible that?

after googling , no examples, here's did.

assuming you're using yeoman scaffolding yo ember generator , using grunt build build dist.

yo ember-generator v0.8 uses grunt-replace. upgrade version. in short, i'm using grunt-replace add global vars index.html. here's how.

add script tag app/index.html before combined-scripts.js block:

#app/index.html <script>   /*     simplify grunt-replace strategy placing env vars here.   */   window.mycompanycom_env = {     env: '@@env',     apihost: '@@apihost'   }; </script>  /* add above before section */ <!-- build:js(.tmp) scripts/main.js --> <script src="scripts/combined-scripts.js"></script> <!-- endbuild --> 

and change replace config in gruntfile.js this:

module.exports = function (grunt) {   var appconfig = grunt.file.readjson('app_config.json');  replace: {   app: {     options: {       patterns: [         {           json: appconfig['app']         }       ]     },     files: [       {src: '<%= yeoman.app %>/index.html', dest: '.tmp/index.html'}     ]   },   dist: {     options: {       patterns: [         {           json: appconfig['dist']         }       ]     },     files: [       {src: '<%= yeoman.dist %>/index.html', dest: '<%= yeoman.dist %>/index.html'}     ]   } } 

create new file @ ./app_config.json

{   "app": {     "env": "development",     "apihost": "http://localhost:8080"     },   "dist": {     "env": "dist",     "apihost": "/"     } } 

now app scripts have access global vars defined in app_config.json.

i won't go more detail works fine in development. grunt build, moved replace:dist step end of build steps, , replaced @@ember variable in index.html path bower component.