JavaScript Transpiling and Polyfilling🪴

Transpiling

Parcel automatically uses Babel to transpile the code.
We can configure Babel a lot if we want, for example, to define exactly what browsers should be supported, etc.
Babel works with plugins and presets that can both be configured.
- A plugin is basically a specific JavaScript feature that we want to transpile.
- A preset is basically a bunch of plugins bundled together.
By default, preset-env is being used, it contains all new features that have already became part of the language after passing ECMAScript 4 stages.
To include experimental feature as well, we may have to manually include the corresponding plugin of that feature.

New language features, such as new array methods and Promises can’t be transpiled, so it need to be polyfilled instead.
We can use core-js to polyfill all features or only ones that we want.

import 'core-js/stable';
// import 'core-js/stable/array/find';
// import 'core-js/stable/promise';

regenerator-runtime is the runtime support for compiled/transpiled async functions.

// Polifilling async functions
import 'regenerator-runtime/runtime';