Babel.js

Overview

Babel is a JavaScript transpiler that compiles not-yet-supported JavaScript, aka ESNext, into readable currently-supported JavaScript. For example, Babel allows the use of async/await, not currently supported in V8.

Why use Babel?

With Babel, applications can utilize superior next generation JavaScript features in advance of VM support. All ESNext features will soon be included in the V8 JavaScript VM upon which both node.js and io.js are built. As ESNext feature support is added to V8, Babel transpilation can be turned off feature-by-feature until it is no longer necessary. One recent example is the inclusion of Promise.

Essentially, Babel gives us a head start on the new JavaScript standard when writing node.js applications.

Setting up Babel

You should already have Babel installed after going through the Set-up guide. If not, install it:

npm install -g babel

Which will install two CLI executables: babel and babel-node. Use babel-node as a drop-in replacement for node to execute files containing ESNext:

//index.js
const name = 'World'
process.nextTick(()=> console.log(`Hello ${name}`))

And run with:

$ babel-node index.js

bode & bodemon

For convenience, Set-up also includes instructions for creating a babel-node alias, bode, and a Babel enabled nodemon alias, bodemon. Both use the --stage 1 Babel setting for experimental features like async/await.

babel & babel-node

babel

Compiles files without running them. babel <file> with no options will output the file content to stdout:

$ babel index.js
//index.js
'use strict';

var name = 'World';
process.nextTick(function () {
  return console.log('Hello ' + name);
});

Compiling to dist/ directory

You can also compile to a dist/ directory, with the --out-dir option:

$ babel index.js --out-dir dist
index.js -> dist/index.js

With the contents of index.js compiled to supported JavaScript in dist/index.js, start the server with node dist.

babel-node

Compiles files and runs them. babel-node <file> works exactly like node <file> after compilation is complete.

$ babel-node index.js
Hello World

Options

A number of options can be used to enable/disable features, including:

CLI

--optional [<transformerName> [, <transformerName>...]]

Enable an array of optional transformers. Notable transformers include:

• es7.asyncFunctions: Enables async/await
• strict: Automatically write "use strict" at the top of all compiled files. (Used in the Set-up alias)

$ babel-node --optional [es7.asyncFunctions, strict] index.js
$ babel --optional [es7.asyncFunctions, strict] index.js

--stage <value>

Enable a group of experimental features.

The bode and bodemon aliases from Set-up use --stage 1 to enable experimental features including async functions as a convenient alternative to --optional above.

$ babel-node --stage 1 index.js
$ babel --stage 1 index.js

only/ignore

Both --only and --ignore take a space separated array of glob patterns to determine which files to compile, but work oppositely. Patterns used with only are compiled, while those with ignore are not. Everything that is not compiled is outputted verbatim, regardless of the option used.

$ babel-node --only **/*.js .
$ babel --ignore **/*.html .

.babelrc

Options can also be enabled using a .babelrc file in the current or user home directory. Enabling the above options would look like:

{
  "stage": 1,
  "optional: ["strict", "es7.classProperties"],
  "ignore": [
    "foo.js",
    "bar/**/*.js"
  ]
}

Resources

• Test features with the Babel REPL
• Overview of available ESNext features