Skip to main content

Babel

Pronunciation
BAY-bul
Updated 2 min read

Share this page

Send the link, quote the definition with a link back, or show it as a card on your own site.

https://softwaredictionary.org/terms/babel

In short

Babel is a JavaScript compiler that rewrites modern JavaScript, JSX and TypeScript syntax into code that older browsers and runtimes can run.

What is Babel?

Babel is a transpiler: a tool that turns source code into other source code at the same level. It reads your JavaScript, parses it into a syntax tree, lets plugins transform that tree and prints new code. It started in 2014 as 6to5, a tool that let developers write the then-new ES6 syntax and still run it in older browsers, and was renamed Babel in 2015.

Each transformation is a plugin, and presets bundle many of them. @babel/preset-env compiles only the syntax your target browsers lack, based on a Browserslist query such as > 0.5%, not dead; @babel/preset-react turns JSX into function calls; and @babel/preset-typescript strips type annotations. Plugins can also do custom work, such as removing debug code or adding test coverage counters, and the React Compiler, which adds memoization automatically, ships as a Babel plugin.

Babel 8, released in June 2026 after eight years of Babel 7, is published only as ES modules, needs Node.js 22 or later, and by default targets Browserslist's defaults query instead of compiling everything down to ES5. Over the same years, much of Babel's everyday work moved to faster tools written in Go and Rust, such as esbuild, SWC and Oxc, which Next.js and Vite use by default; Babel remains common where its plugins are needed.

Babel is often confused with a bundler and with a polyfill. A bundler such as webpack combines many files into a few and can run Babel on each one through babel-loader; Babel itself transforms one file at a time. Babel rewrites syntax, such as optional chaining or classes, but can't add missing built-in functions such as Array.prototype.at; those come from polyfills, for example core-js, which a separate Babel plugin can insert where needed. It also strips TypeScript types without checking them, so projects still run tsc to catch type errors.

Key takeaways

  • Babel is a JavaScript transpiler that rewrites new syntax into older syntax.
  • Plugins do each transformation; presets such as @babel/preset-env bundle them.
  • It also compiles JSX and strips TypeScript types, without type-checking.
  • Babel 8 (2026) is ESM-only and targets modern browsers by default.
  • Faster tools such as SWC and esbuild now handle many builds; Babel stays where its plugins are needed.

Example

A babel.config.json for a React and TypeScript projectjson
{
  "presets": [
    ["@babel/preset-env", { "targets": "> 0.5%, not dead" }],
    "@babel/preset-react",
    "@babel/preset-typescript"
  ],
  "plugins": ["babel-plugin-react-compiler"]
}

Readers ask

Is Babel still needed?

Less than before. Modern browsers support almost all current syntax, and faster tools such as SWC, esbuild and Oxc handle TypeScript and JSX in most new projects. Babel is still used where a specific plugin is needed, such as the React Compiler, and in older build setups.

What is the difference between Babel and the TypeScript compiler?

Both can turn TypeScript into JavaScript. tsc also checks types, while Babel only removes them, quickly and one file at a time; many projects let a fast tool compile the code and run tsc --noEmit only for checking.

What does @babel/preset-env do?

It looks at the browsers or Node.js versions you target and applies only the transformations they need, so code for modern browsers stays close to what you wrote.

See also

Sources

Spotted a mistake or something missing on this page?Suggest an edit

More

Settings