Babel.js is a command line tool that lets you transpile ES6 code into ES5 code that runs in current JavaScript environments, including Node.js and browsers.
# To install globally
$ npm install -g babel
# to install locally per package
$ npm install --save-dev babel
Use babel-node
for Node.js:
# Using Nod
$ babel-node
Object.assign({}, {message: 'hell yeah\'}); // => { message: 'hell yeah!' }
You need babel
and browserify
if you want to run ES6 on browsers
$ npm install --save-dev babelify browserify
To use Object.assign()
and Object.is()
, etc. in browsers:
$ npm install --save core-js
At the top of your js file:
require('core-js');
Use ESLint to lint your code in ES6:
$ npm install --save-dev eslint
Compile ES6 code to ES5:
$ babel script.js --out-file script-compiled.js
To compile from a directory, use -d
option:
$ babel -d build-dir source-dir
To setup debugger work properly:
$ babel -d build-dir source-dir -s
To compile for the browser, install browserify
and browser-run
.
npm install -g browserify browser-run
browserify -t babelify script.js | browser-run -p 8080
Compile a bundle:
$ browserify script.js -t babelify --outfile bundle.js
Import modules using ES6 syntax:
import 'core-js'; // Node module
import harness from './harness'; // ES6 module
Add to package.json
:
"scripts": {
"lint": "eslint source",
"clean": "rm -rf build/* && mkdir build/public && mkdir build/server && mkdir build/client",
"build-server": "babel -d build/server source/server -s",
"build-client": "browserify source/client/index.js -t babelify --outfile build/client/bundle.js",
"build": "npm run clean && npm run build-server && npm build-client"
}
Reference: