Using Babel

Babel is a popular library that allows developers to use next generation JavaScript (e.g. ES2015) in today's browsers via transpiling code into ES5. As of Steal 1.0 Babel is the default transpiler. This page explains some of the ways you can configure it.

Specifying version

Steal bundles a version of Babel from the babel-standalone project. This is based on Babel version 6.

If you want to use the version of Babel that comes with Steal you can skip this section.

If you have a code-base that needs a specific version of Babel you can include it using paths config. Here's an example of using Babel version 5.

"steal": {
  "paths": {
    "babel": "node_modules/babel-core/browser.js"
  }
}

When building you'll also need to do transpiling yourself, which you can do by providing a custom transpile function:

var babel = require("babel-core"); // This is my version of babel
var stealTools = require("steal-tools");

stealTools.build({
  config: __dirname + "/package.json!npm"
}, {
  transpile: function(source, compileOptions) {
    return babel.transform(source, compileOptions);
  }
});

Plugins / Presets

Steal's bundled version of Babel comes with the presets and plugins provided by the babel-standalone project. You can see the full list here.

To specify which plugins/presets you want to use, specify the babelOptions configuration like so:

"steal": {
  "babelOptions": {
    "presets": ["react"]
  }
}

Defaults

Steal uses the following options by default even if custom presets/plugins are provided.

{
  "presets": [
    "es2015-no-commonjs",
    "react",
    "stage-0"
  ],
  "plugins": [
    "transform-es2015-modules-systemjs"
  ]
}