Babel Compiler

Babel is a toolchain that is mainly used to convert ECMAScript 2015+ code into a backwards compatible version of JavaScript in current and older browsers or environments. Here are the main things Babel can do for you:

• Transform syntax
• Polyfill features that are missing in your target environment (through @babel/polyfill)
• Source code transformations (codemods)

// Babel Input: ES2015 arrow function

[1, 2, 3].map((n) => n + 1);

// Babel Output: ES5 equivalent

[1, 2, 3].map(function(n) {

return n + 1;

});

JSX and React

Babel can convert JSX syntax! Check out our React preset to get started. Use it together with the babel-sublime package to bring syntax highlighting to a whole new level. You can install this preset with

npm install –save-dev @babel/preset-react

and add @babel/preset-react to your Babel configuration.

export default React.createClass({

getInitialState() {

return { num: this.getRandomNumber() };

},

getRandomNumber() {

return Math.ceil(Math.random() * 6);

},

render() {

return <div>

Your dice roll:

{this.state.num}

</div>;

}

});