Ember Cli - Transpiling vendor ES6 dependency in ember-cli-build?

Question

I'm writing an Ember.js application using Ember Cli, and I want to include a non-bower dependency - basically a dependency from my vendor folder.

The instructions on doing so is telling me to add the following line into my ember-cli-build.js file:

app.import('vendor/dependency-to-include.js');

That would work fine with a normal ES5 flavored dependency, but what if I want to add a dependency written in ES6?

Right now it just delivers it to the browser untouched, which produces an error like:

Uncaught SyntaxError: Unexpected reserved word

because my ES6 flavored dependency uses the following syntax:

import Util from './util

I'm guessing that I need to tell ember-cli-build to transpile this particular dependency before passing it on to the browser, but how do I go about doing that?

Thanks

Answer 1

For transpiling imported dependencies you need to run the imported file(s) through the broccoli addon broccoli-babel-transpiler. For a basic example, checkout this file: https://github.com/thefrontside/ember-impagination/blob/2fa38d26ef1b27a3db7df109faa872db243e5e4c/index.js. You can adapt this addon to an in-repo addon for your project. See this link for the background discussion and @rwjblue and @cowboyd on the actual fix: https://github.com/ember-cli/ember-cli/issues/2949