Module imports in EmberCLI

If you've worked with EmberCLI a bit, you've probably run across a few import lines that look like:

import Ember from 'ember';

This actually gives you the Ember global (eventually the Ember module), but silences your jshinter which is warning you that you shouldn't really use globals. This prepares you for some long term changes to EmberCLI.

Sometimes, however, you might want to be more specific.

You can do this in a couple of ways, the last of which is what I'd recommend.

First, utilizing ember-cli-shims:

import computed from 'ember-computed';
// or 
import { alias }  from 'ember-computed';

This is great. You can look at the ember-cli-shims repo to see what shims have been made available. However, I'd caution you here, it is likely that there will be changes to these shims. For example, ember-computed could change to @ember/computed. So, I'd actually reccomend...

Second, import and immediate destructure:

import Ember from 'ember';

const { computed } = Ember;

This leverages es6 style destructuring. This way your code doesn't have to change when the module import changes are complete, you'll just have to remove the destructuring assignment and update your import statements.

Cheers

Tweet