Skip to content

Instantly share code, notes, and snippets.

@lukem512
Created May 15, 2017 18:28
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save lukem512/29673ba5d193bd595a67b836d63ce082 to your computer and use it in GitHub Desktop.
Save lukem512/29673ba5d193bd595a67b836d63ce082 to your computer and use it in GitHub Desktop.
Setting up babel, a beginners guide

Setting up Babel

  1. Install babel-cli and save it to your developer dependencies
npm i --save-dev babel-cli
  1. Install a preset of your choice. Presets indicate which version of EcmaScript to use. The env preset is the most recent version.
npm i --save-dev babel-preset-env
  1. Create a .babelrc file in the root of your project. The .babelrc file specifies which preset to use, along with any plugins or other configuration options.

A minimal .babelrc file looks like this:

{
  "preset": ["env"]
}
  1. Install any plugins you wish to use. Plugins enable specific syntactic or language features. For example, to enable object spread, the following steps should be performed:
npm i --save-dev babel-plugin-transform-object-rest-spread
{
  "plugins": ["transform-object-rest-spread"],
  "presets": ["env"]
}
  1. Add a build script to your package.json to transpile your JavaScript using babel. This example transpiles all .js files inside the src/ directory and outputs to lib/.
"scripts": {
  "build": "babel src -d lib",
},
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment