What is a babel preset and why do I need it?
There are several questions about specific babel presets but none explain the need for it (e.g. what's the difference between babel-preset-stage-0, babel-preset-stage-1 etc)
Also the babel docs do not explain the necessity: https://babeljs.io/docs/plugins/preset-latest/
Babel Presets:
Read this excellent post: https://www.fullstackreact.com/articles/what-are-babel-plugins-and-presets
A preset is a set of plugins used to support particular language features.
The two presets Babel uses by default:
- es2015: Adds support for ES2015 (or ES6) JavaScript
- react: Adds support for JSX
... ES2015 is just another name used for ES6 ... [1]
Preset stages:
Stages represent the status of experimental features. Pre stage-3 should be used with caution.
... Beyond ES7, proposed JavaScript features can exist in various stages: [1]
stage-0 - Strawman: just an idea, possible Babel plugin.
stage-1 - Proposal: this is worth working on.
stage-2 - Draft: initial spec.
stage-3 - Candidate: complete spec and initial browser implementations.
stage-4 - Finished: will be added to the next yearly release. [2]
[1] https://www.fullstackreact.com/articles/what-are-babel-plugins-and-presets
From the docs:
Presets are sharable .babelrc configs or simply an array of babel plugins.
Babel is a tool for transforming JS.
A plugin a some code for performing a particular transformation.
You have to specify which plugins you want to use with a config.
A preset is just a prewritten config you can use to get common sets of transforms.
