Plugins and presets

Plugins tell Babel how to transform your code, and presets are predefined groups of plugins. For example, you have the es2017 preset, which includes the plugins syntax-trailing-function-commas and transform-async-to-generator, which are required to support ECMAScript 2017 syntax. There's also the react preset, which includes the transform-react-jsx plugin (among others) to allow Babel to understand JSX.

To use a plugin or preset, you can install it as a development dependency, and specify it in the .babelrc. For example, if I want to support ECMAScript 2017 syntax, but also the rest and spread operators for objects (a ES2018 feature), I could run the following:

$ yarn add @babel/preset-es2017 @babel/plugin-syntax-object-rest-spread --dev

And, add the setting into .babelrc:

{
  "presets": ["@babel/es2017"],
  "plugins": ["@babel/syntax-object-rest-spread"]
}