Babel Config Generator

Generate a Babel configuration in seconds. Pick your output format, presets and plugins, then copy the config into your project — free and private.

Save the output under the filename shown above it, in your project root.

How to Use

  1. Choose the config file format.
  2. Tick the presets and plugins you need.
  3. The config regenerates live as you change options.
  4. Press Copy config and save it under the shown filename.

Key Features

  • Three formats — babel.config.json, babel.config.js and .babelrc.
  • Common presets — env, React and TypeScript.
  • Popular plugins — runtime transform and class properties.
  • Live output — regenerates with every change.
  • 100% private — everything runs in your browser; nothing is sent or stored.

FAQs

Which format should I choose?

babel.config.json suits most projects. Use babel.config.js when you need logic or comments in the config, and .babelrc for file-relative configuration.

What does @babel/preset-env do?

It compiles modern JavaScript down to a version your target browsers support, based on your browserslist query.

Do I need the plugins?

Only tick a plugin when your code needs it — for example, class properties for the class fields syntax.

Is my data sent anywhere?

No. The config is generated entirely in your browser and never transmits or saves your entries.

Related Tools

JS Minifier · Code Beautifier · Package.json Generator · Commit Message Generator

Scroll to Top