intermediate

Babel

Transform JavaScript syntax through plugins and presets while understanding polyfills, targets, and runtime helpers.

Babel transforms JavaScript syntax via presets and plugins. `@babel/preset-env` targets browser or Node versions; plugins add JSX, TypeScript syntax, decorators, or instrumentation.

					{
  "presets": [["@babel/preset-env", { "targets": "defaults" }]],
  "plugins": ["@babel/plugin-transform-runtime"]
}

Polyfill strategies matter: `useBuiltIns` with `core-js` versus runtime helpers via `@babel/plugin-transform-runtime`. Libraries should avoid polluting global prototypes.

On interviews: preset-env targets, polyfill versus runtime helpers, plugin order, TypeScript-with-Babel still needing `tsc`, and custom transforms for codemods.

Common pitfalls: over-transpiling modern syntax; global polyfills in libraries; huge plugin chains slowing CI.

The trade-off is unmatched transform flexibility versus compile time and config complexity.

Checklist:

Set explicit compilation targets.
Choose polyfill strategy deliberately.
Do not confuse transpile with bundling.
Keep plugin set minimal and documented.