Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Misc Updates #154

Merged
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
148 changes: 103 additions & 45 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -52,12 +52,42 @@ var app = new EmberApp({
});
```

### Polyfill
### Options

There are a few different options that may be provided to ember-cli-babel. These options
are typically set in an apps `ember-cli-build.js` file, or in an addons `index.js`.

```ts
interface EmberCLIBabelConfig {
/**
Configuration options for babel-preset-env.
See https://github.com/babel/babel-preset-env#options for details on these options.
*/
babel?: {
spec?: boolean;
loose?: boolean;
debug?: boolean;
include?: string[];
exclude?: string[];
useBuiltIns?: boolean;
};

/**
Configuration options for ember-cli-babel itself.
*/
'ember-cli-babel'?: {
includePolyfill?: boolean;
compileModules?: boolean;
disableDebugTooling?: boolean;
};
}
```

#### Polyfill

Babel comes with a polyfill that includes a custom [regenerator runtime](https://github.com/facebook/regenerator/blob/master/runtime.js)
and [core.js](https://github.com/zloirock/core-js). Many transformations will work without it, but for full support you
must include the polyfill in your app. The [Babel feature tour](https://babeljs.io/docs/tour/) includes a note for
features that require the polyfill to work.
and [core-js](https://github.com/zloirock/core-js). Many transformations will work without it, but for full support you
may need to include the polyfill in your app.

To include it in your app, pass `includePolyfill: true` in your `ember-cli-babel` options.

Expand All @@ -71,31 +101,86 @@ var app = new EmberApp(defaults, {
});
```

### Addon usage
#### Modules

For addons which want additional customizations, they are able to interact with
this addon directly.
Older versions of Ember CLI (`< 2.12`) use its own ES6 module transpiler. Because of that, this plugin disables Babel
module compilation by blacklisting that transform when running under affected ember-cli versions. If you find that you
want to use the Babel module transform instead of the Ember CLI one, you'll have to explicitly set `compileModules` to `true`
in your configuration. If `compileModules` is anything other than `true`, this plugin will leave the module
syntax compilation up to Ember CLI.

```js
treeForAddon(tree) {
let addon = this.addons.find(addon => addon.name === 'ember-cli-babel'); // find your babel addon
#### Disabling Debug Tooling Support

let options = addon.buildBabelOptions({
'ember-cli-babel'
})
If for some reason you need to disable this debug tooling, you can opt-out via configuration.

return addon.transpileTree(tree, {
'babel': {
// any babel specific options
},
In an app that would look like:

```js
// ember-cli-build.js
module.exports = function(defaults) {
let app = new EmberApp(defaults, {
'ember-cli-babel': {
// any ember-cli-babel options
disableDebugTooling: true
}
});

return app.toTree();
}
```

### Addon usage

For addons which want additional customizations, they are able to interact with
this addon directly.

```ts
interface EmberCLIBabel {
/**
Used to generate the options that will ultimately be passed to babel itself.
*/
buildBabelOptions(config?: EmberCLIBabelConfig): Opaque;

/**
Supports easier transpilation of non-standard input paths (e.g. to transpile
a non-addon NPM dependency) while still leveraging the logic within
ember-cli-babel for transpiling (e.g. targets, preset-env config, etc).
*/
transpileTree(inputTree: BroccoliTree, config?: EmberCLIBabelConfig): BroccoliTree;

/**
Used to determine if a given plugin is required by the current target configuration.
Does not take `includes` / `excludes` into account.

See https://github.com/babel/babel-preset-env/blob/master/data/plugins.json for the list
of known plugins.
*/
isPluginRequired(pluginName: string): boolean;
}
```

#### `buildBabelOptions` usage

```js
// find your babel addon (can use `this.findAddonByName('ember-cli-babel')` in ember-cli@2.14 and newer)
let babelAddon = this.addons.find(addon => addon.name === 'ember-cli-babel');

// create the babel options to use elsewhere based on the config above
let options = babelAddon.buildBabelOptions(config)

// now you can pass these options off to babel or broccoli-babel-transpiler
require('babel-core').transform('something', options);
```

#### `transpileTree` usage

```js
// find your babel addon (can use `this.findAddonByName('ember-cli-babel')` in ember-cli@2.14 and newer)
let babelAddon = this.addons.find(addon => addon.name === 'ember-cli-babel');

// invoke .transpileTree passing in the custom input tree
let transpiledCustomTree = babelAddon.transpileTree(someCustomTree);
```

### Debug Tooling

In order to allow apps and addons to easily provide good development mode ergonomics (assertions, deprecations, etc) but
Expand Down Expand Up @@ -156,30 +241,3 @@ replaced by `false`. When ran through a minifier (with dead code elimination) th

Please note, that these general purpose environment related flags (e.g. `DEBUG` as a boolean flag) are imported from `@glimmer/env`
not from an `@ember` namespace.

#### Disabling Debug Tooling Support

If for some reason you need to disable this debug tooling, you can opt-out via configuration.

In an app that would look like:

```js
// ember-cli-build.js
module.exports = function(defaults) {
let app = new EmberApp(defaults, {
'ember-cli-babel': {
disableDebugTooling: true
}
});

return app.toTree();
}
```

### About Modules

Older versions of Ember CLI (`< 2.12`) use its own ES6 module transpiler. Because of that, this plugin disables Babel
module compilation by blacklisting that transform when running under affected ember-cli versions. If you find that you
want to use the Babel module transform instead of the Ember CLI one, you'll have to explicitly set `compileModules` to `true`
in your configuration. If `compileModules` is anything other than `true`, this plugin will leave the module
syntax compilation up to Ember CLI.
36 changes: 31 additions & 5 deletions index.js
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,8 @@ const VersionChecker = require('ember-cli-version-checker');
const clone = require('clone');
const path = require('path');

let count = 0;

function addBaseDir(Plugin) {
let type = typeof Plugin;

Expand Down Expand Up @@ -34,8 +36,22 @@ module.exports = {
return this._getBabelOptions(config);
},

transpileTree(tree, config) {
return require('broccoli-babel-transpiler')(tree, this.buildBabelOptions(config));
_debugTree() {
if (!this._cachedDebugTree) {
this._cachedDebugTree = require('broccoli-debug').buildDebugCallback(`ember-cli-babel:${this._parentName()}`);
}

return this._cachedDebugTree.apply(null, arguments);
},

transpileTree(inputTree, config) {
let description = `000${++count}`.slice(-3);
let postDebugTree = this._debugTree(inputTree, `${description}:input`);

let BabelTranspiler = require('broccoli-babel-transpiler');
let output = new BabelTranspiler(postDebugTree, this.buildBabelOptions(config));

return this._debugTree(output, `${description}:output`);
},

setupPreprocessorRegistry: function(type, registry) {
Expand Down Expand Up @@ -121,7 +137,7 @@ module.exports = {
return (this.parent && this.parent.options) || (this.app && this.app.options) || {};
},

_getAddonProvidedConfig: function(addonOptions) {
_parentName() {
let parentName;

if (this.parent) {
Expand All @@ -132,6 +148,10 @@ module.exports = {
}
}

return parentName;
},

_getAddonProvidedConfig(addonOptions) {
let babelOptions = clone(addonOptions.babel || {});

// used only to support using ember-cli-babel@6 at the
Expand Down Expand Up @@ -170,7 +190,12 @@ module.exports = {
let addonProvidedConfig = this._getAddonProvidedConfig(config);
let shouldCompileModules = this._shouldCompileModules(config);

let options = {};
let providedAnnotation = config['ember-cli-babel'] && config['ember-cli-babel'].annotation;

let options = {
annotation: providedAnnotation || `Babel: ${this._parentName()}`
};

let userPlugins = addonProvidedConfig.plugins;
let userPostTransformPlugins = addonProvidedConfig.postTransformPlugins;

Expand Down Expand Up @@ -212,7 +237,8 @@ module.exports = {
},

debugTools: {
source: '@ember/debug'
source: '@ember/debug',
assertPredicateIndex: 1
}
};

Expand Down
31 changes: 29 additions & 2 deletions node-tests/addon-test.js
Original file line number Diff line number Diff line change
Expand Up @@ -144,7 +144,7 @@ describe('ember-cli-babel', function() {
expect(
output.read()
).to.deep.equal({
"foo.js": `define('foo', [], function () {\n 'use strict';\n\n (true && Ember.assert('stuff here', isNotBad()));\n});`
"foo.js": `define('foo', [], function () {\n 'use strict';\n\n (true && !(isNotBad()) && Ember.assert('stuff here', isNotBad()));\n});`
});
}));
});
Expand Down Expand Up @@ -190,7 +190,7 @@ describe('ember-cli-babel', function() {
expect(
output.read()
).to.deep.equal({
"foo.js": `define('foo', [], function () {\n 'use strict';\n\n (false && Ember.assert('stuff here', isNotBad()));\n});`
"foo.js": `define('foo', [], function () {\n 'use strict';\n\n (false && !(isNotBad()) && Ember.assert('stuff here', isNotBad()));\n});`
});
}));
});
Expand Down Expand Up @@ -505,6 +505,33 @@ describe('ember-cli-babel', function() {
expect(result.babelrc).to.be.false;
});

it('provides an annotation including parent name - addon', function() {
this.addon.parent = {
name: 'derpy-herpy'
};
let result = this.addon.buildBabelOptions();
expect(result.annotation).to.include('derpy-herpy');
});

it('provides an annotation including parent name - project', function() {
this.addon.parent = {
name() { return 'derpy-herpy'; }
};
let result = this.addon.buildBabelOptions();
expect(result.annotation).to.include('derpy-herpy');
});

it('uses provided annotation if specified', function() {
let options = {
'ember-cli-babel': {
annotation: 'Hello World!'
}
};

let result = this.addon.buildBabelOptions(options);
expect(result.annotation).to.equal('Hello World!');
});

it('does not include all provided options', function() {
let babelOptions = { blah: true };
let options = {
Expand Down
3 changes: 2 additions & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -36,11 +36,12 @@
},
"dependencies": {
"amd-name-resolver": "0.0.6",
"babel-plugin-debug-macros": "^0.1.7",
"babel-plugin-debug-macros": "^0.1.10",
"babel-plugin-transform-es2015-modules-amd": "^6.24.0",
"babel-polyfill": "^6.16.0",
"babel-preset-env": "^1.5.1",
"broccoli-babel-transpiler": "^6.0.0",
"broccoli-debug": "^0.6.2",
"broccoli-funnel": "^1.0.0",
"broccoli-source": "^1.1.0",
"clone": "^2.0.0",
Expand Down
12 changes: 9 additions & 3 deletions yarn.lock
Original file line number Diff line number Diff line change
Expand Up @@ -432,12 +432,18 @@ babel-plugin-check-es2015-constants@^6.22.0:
dependencies:
babel-runtime "^6.22.0"

babel-plugin-debug-macros@^0.1.1, babel-plugin-debug-macros@^0.1.6, babel-plugin-debug-macros@^0.1.7:
babel-plugin-debug-macros@^0.1.1, babel-plugin-debug-macros@^0.1.6:
version "0.1.10"
resolved "https://registry.npmjs.org/babel-plugin-debug-macros/-/babel-plugin-debug-macros-0.1.10.tgz#dd077ad6e1cc0a8f9bbc6405c561392ebfc9a01c"
dependencies:
semver "^5.3.0"

babel-plugin-debug-macros@^0.1.10:
version "0.1.10"
resolved "https://registry.yarnpkg.com/babel-plugin-debug-macros/-/babel-plugin-debug-macros-0.1.10.tgz#dd077ad6e1cc0a8f9bbc6405c561392ebfc9a01c"
dependencies:
semver "^5.3.0"

babel-plugin-htmlbars-inline-precompile@^0.2.3:
version "0.2.3"
resolved "https://registry.npmjs.org/babel-plugin-htmlbars-inline-precompile/-/babel-plugin-htmlbars-inline-precompile-0.2.3.tgz#cd365e278af409bfa6be7704c4354beee742446b"
Expand Down Expand Up @@ -939,9 +945,9 @@ broccoli-config-replace@^1.1.2:
debug "^2.2.0"
fs-extra "^0.24.0"

broccoli-debug@^0.6.1:
broccoli-debug@^0.6.1, broccoli-debug@^0.6.2:
version "0.6.2"
resolved "https://registry.npmjs.org/broccoli-debug/-/broccoli-debug-0.6.2.tgz#4c6e89459fc3de7d5d4fc7b77e57f46019f44db1"
resolved "https://registry.yarnpkg.com/broccoli-debug/-/broccoli-debug-0.6.2.tgz#4c6e89459fc3de7d5d4fc7b77e57f46019f44db1"
dependencies:
broccoli-plugin "^1.2.1"
fs-tree-diff "^0.5.2"
Expand Down