How to access the environment parameter from ember-cli-build.js

Question

When you do:

ember build --environment="production"

The environment parameter is made available in config/environment.js:

module.exports = function(environment) {
  ...
};

I also need to access the environment from within ember-cli-build.js:

let STATIC_URL = "TODO";  // This depends on the deploy "environment" parameter

module.exports = function(defaults) {
  let app = new EmberApp(defaults, {
    fingerprint: {
      enabled: true,
      prepend: STATIC_URL,
    },
  });

  return app.toTree();
};

How can I access the environment parameter from ember-cli-build.js?

Anabal

Are you using Broccoli? where is the above code block located, what's the filename? – Assamese

@omouse: I am using ember-cli, which is using broccoli (as listed in the packages.json). I have added the versions of ember-cli et al. The code location is already specified in the question, but I'll repeat. From the ember project top dir: config/environment.js and ember-cli-build.js – Anabal

Answer 1

In our Brocfile.js (I guess yours is called ember-cli-build.js?) we are doing something like this:

var EmberApp = require('ember-cli/broccoli/ember-app');
var environment = process.env.EMBER_ENV || 'development';
var config = require('./config/environment')(environment);

var app = new EmberApp(/* configuration for the app... */ );
module.exports = app.toTree();

The line where we're assigning to the environment variable is how you get which environment you're in. We use the EMBER_ENV command line variable but you can use something different. Basically in all our code we run ember like this:

EMBER_ENV=production ember-cli start
EMBER_ENV=test ember-cli test

# the next lines use the same 'development' environment
EMBER_ENV=development ember-cli start
ember-cli start

Assamese

Thanks. Interesting, but maybe duplication of functionality. The ember executable already accepts a --environment parameter, so setting up and EMBER_ENV environment variable looks like redundant information. – Anabal

And yes, my "Brocfile" is called now (ember-cli has recently renamed things) ember-cli-build.js – Anabal

@gonvaled you may want to insert some console.logs to see if the right environment is being set (and yes EMBER_ENV is unique to our codebase, check out the ember-cli user guide on environment) – Assamese

Five years later, this is still the way of accessing the config/environment configuration from ember-cli-build.js. Thanks! – Misdirection

Answer 2

I'm using Ember 2.5. To access the environment parameter from ember-cli-build.js, use process.env.EMBER_ENV. Here's my ember-cli-build.js:

let EmberApp = require('ember-cli/lib/broccoli/ember-app');

module.exports = function(defaults) {
  let app = getApp(defaults, process.env.EMBER_ENV);

  // Use `app.import` to add additional libraries to the generated
  // output files.

  return app.toTree();
};

function getApp(defaults, environment) {
  switch(environment) {

    case "production":
      return new EmberApp(defaults, {
        fingerprint: {
          enabled: true
        },
      });

    default:
      return new EmberApp(defaults, {
        fingerprint: {
          enabled: false
        },
      });     

  }
}

Use

Answer 3

EDIT:
I just recognized that you need environment already in ember-cli-build.js not only in app.js, so this answer might not work. I'll leave it posted anyway, may be it'll help!

my configuration is a bit different, but the including of enviroment is the same:

// app.js - I stripped some unrelated stuff
import Ember from 'ember';
import Resolver from 'ember/resolver';

import ENV from 'my-appname/config/environment';

var App;


App = Ember.Application.extend({
  fingerprint: {
     enabled: true,
     prepend: ENV.STATIC_URL,
  },
  modulePrefix: config.modulePrefix,
  podModulePrefix: config.podModulePrefix,
  Resolver: Resolver,
});

export default App;

Now you can change STATIC_URL in enviroment.js depending on the enviroment you get passed to:

// config/enviroment.js
module.exports = function(environment) {
    var ENV;
    if(environment==='production') {
        ENV.STATIC_URL='foo';
    }
    return ENV;
}

Note that config/environment lives under your dasherized appname.

Openhanded

Looks good but you are doing the fingerprint on app.js? That is not what the ember-cli guide recommends. Now I am confused ... I thought Ember.Application from app.js is creating an Ember application on the client side, and has nothing to do with asset compilation. On the other hand, new EmberApp from ember-cli-build.js is setting up the broccoli asset pipeline to generate a distributable asset tree. Fingerprinting involves asset processing, including processing of the index.html. Not sure how it is done in app.js?! – Anabal

And you are doing import ENV from 'my-appname/config/environment'; from app.js. I do not know what version of ember-cli you are using, or the structure of your project, but from a vanilla ember-cli application (1.13.13) you do not need to prefix the app-name on the import (actually, that is ember-cli generated code for me) – Anabal

I have tried and it is indeed not working: the index.html has no references to the right assets (with the prefix STATIC_URL). I would say fingerprinting is not being used when defining Ember.Application (as I expected). Could you clarify your setup? – Anabal

yes, the prefix of app-name I only include to make that path absolute, because when including environment in a nested controller I ended up with import ENV from '../../../../../../config/environment.js'. So I just kept it absolute everywhere. – Openhanded

no, I don't use fingerprint at all, I just included it because of your example. I didn't know it's a predefined property... – Openhanded

after your comments I'm afraid I can't help, I didn't realize you need it to build different index.html depending on env. – Openhanded

Thanks anyway! Can not upvote or accept since it does not address my problem, but can be interesting for other usecases. – Anabal

Answer 4

From within ember-cli-build.js you can call EmberApp.env(), like so:

let STATIC_URL = EmberApp.env() === 'development' ? "TODO" : "READY";

module.exports = function(defaults) {
  let app = new EmberApp(defaults, {
    fingerprint: {
      enabled: true,
      prepend: STATIC_URL,
    },
  });

  return app.toTree();
};

Swart