6to5

6to5 turns ES6 code into vanilla ES5, so you can use ES6 features today.

• Fast - no redundant code added so your compiled code is as fast as possible.
• Extensible - with a large range of plugins.
• Lossless - source map support so you can debug your compiled code with ease.
• Compact - maps directly to the equivalent ES5 with no runtime.
• Concise - does not pollute scope with unneccesary variables.

Installation

$ npm install -g 6to5

Plugins

• Browserify
• Connect Middleware

Community

• Broccoli
• Brunch
• Gulp
• Grunt

Features

• Array comprehension
• Arrow functions
• Block binding
• Classes
• Computed property names
• Constants
• Default parameters
• Destructuring
• For-of
• Modules
• Numeric literals
• Property method assignment
• Property name shorthand
• Rest parameters
• Spread
• Template literals

To be implemented:

• Generators

Usage

CLI

Compile the file script.js and output it to script-compiled.js.

$ 6to5 script.js -o script-compiled.js

Compile the entire src directory and output it to the lib directory.

$ 6to5 src -d lib

Compile the file script.js and output it to stdout.

$ 6to5 script.js

Node

Launch a repl.

$ 6to5-node

Evaluate code.

$ 6to5-node -e "class Test { }"

Compile and run test.js.

$ 6to5-node test

Node

var to5 = require("6to5");

to5.transform("code();");

to5.transformFileSync("filename.js");

to5.transformFile("filename.js", function (err, data) {

});

Options

to5.transform("code();", {
  // List of transformers to EXCLUDE
  // This is a camelised version of the name found in `features`
  // eg. "Arrow functions" is "arrowFunctions"
  blacklist: [],

  // List of transformers to ONLY use.
  // See `blacklist` for naming scheme.
  whitelist: [],

  // Append source map and comment to bottom of returned output.
  sourceMap: false,

  // Returns an object `{ code: "", map: {} }` instead of an appended string.
  sourceMapObject: false,

  // Filename for use in errors etc.
  filename: "unknown",

  // Format options
  // See https://github.com/Constellation/escodegen/wiki/API for options.
  format: {}
});

Require hook

All subsequent files required by node will be transformed into ES5 compatible code. An ES6 polyfill is also required negating the polyfill caveat.

require("6to5/register");

Caveats

Polyfill

6to5 does not include a runtime nor polyfill and it's up to the developer to include one in compiled browser code.

A polyfill is included with 6to5 code that can be included in node like so:

require("6to5/polyfill");

This is simply a wrapper around the es6-shim and es6-symbol polyfills.

When using the require hook the aforementioned polyfill is automatically required.

If you're planning on using 6to5 output in the browser then it's up to you to include polyfills. es6-symbol and es6-shim fill the vast majority of polyfill concerns.

For-of

A polyfill is required for for-of functionality that implements Symbol and adds prototype[Symbol.iterator] behaviour to built-ins. Using the polyfills specified in polyfill suffices.

Classes

Built-in classes such as Date, Array and DOM cannot be subclassed due to limitations in ES5 implementations.

Comparison to Traceur

6to5 is different to Traceur in a few very distinct ways.

Runtime

Traceur requires quite a bulky runtime (~75KB) and produces quite verbose code. While this can be trimmed down by selectively building the runtime, it's an unneccesary step when a runtime can be eliminated entirely.

Instead of mapping to a runtime, 6to5 maps directly to the equivalent ES5. This means that your transpiled code will be as simple as possible and is exactly the equivalent ES5.

Performance