Want to use a new JavaScript feature before every browser supports it? Transpilation translates source code into other source code, letting you write ESNext while producing JavaScript suited to the browsers you need to support. section 2.0 section 2.1
A transpiler is a kind of compiler, but its output is source code rather than machine code. It can translate between languages, as with CoffeeScript and JavaScript, or between versions of JavaScript, as with Babel. section 2.1
To try it with Babel 6:
- Create a project with npm and install babel-cli as a development dependency. section 2.2
- Install babel-preset-es2015 and put {"presets": ["es2015"]} in a .babelrc file at the project root. Babel 6 performs no transformations by default; a preset or plugin must be both installed and configured. section 2.2
- Put your JavaScript in src/index.js, then direct Babel to write the transformed files to dist. section 2.2
The command reads the src directory and writes transpiled files to dist; without the output-directory option, Babel prints the result in the terminal. section 2.2
One small transformation
Put `let foo = "bar";` in src/index.js. With the ES2015 preset configured, the generated dist/index.js contains `"use strict";` followed by `var foo = "bar";`. Check the generated file to see what Babel changed. section 2.2
For a quick check, change the source file, run Babel again, and compare src/index.js with dist/index.js. Keep editing the source, not the generated output. section 2.2
