babel-preset-o

0.4.3 verified Sat Apr 25 auth: no javascript

A tiny and flexible Babel preset for React development, combining @babel/preset-env and @babel/preset-react with sensible defaults. Version 0.4.3 is the latest stable release; the package is actively maintained but has limited community adoption. It simplifies configuration by wrapping two commonly used presets into one, supporting custom options for targets, modules, useBuiltIns, and runtime mode (classic or automatic). Compared to alternatives like babel-preset-react-app, this preset is more lightweight and configurable, suitable for projects that need a minimal Babel setup without opinionated defaults.

Common errors

error Error: Cannot find module '@babel/preset-env' ↓

cause Missing peer dependency @babel/preset-env

fix

npm install @babel/preset-env @babel/preset-react --save-dev

error Preset options object is not being applied ↓

cause Preset not wrapped in an array with name

fix

Use ['babel-preset-o', { modules: 'commonjs' }] instead of ['babel-preset-o', { modules: 'commonjs' }] (check nesting).

error JSX not transpiled, React is undefined ↓

cause Default runtime is 'classic', requires React in scope

fix

Set runtime: 'automatic' or add import React from 'react' in every JSX file.

Warnings

gotcha Preset options must be passed in an array format: ['babel-preset-o', options]. Omitting the array or misplacing options will silently ignore them. ↓

fix Use ['babel-preset-o', { ... }] in the presets array.

gotcha The 'runtime' option defaults to 'classic', which uses React.createElement. If using React 17+ JSX transform, set runtime: 'automatic' to avoid unused React imports. ↓

fix Set runtime: 'automatic' in preset options if using React 17+ and the new JSX transform.

deprecated The 'useBuiltIns' option is deprecated in Babel 7.4+; prefer using @babel/polyfill or core-js directly. ↓

fix Consider removing useBuiltIns and installing core-js directly for polyfills.

Install

npm install babel-preset-o

yarn add babel-preset-o

pnpm add babel-preset-o

Imports

babel-preset-o
wrong
```
module.exports = { presets: [require('babel-preset-o')] }
```
correct
```
module.exports = { presets: ['babel-preset-o'] }
```
Use string reference in presets array; requiring is unnecessary but might work if preset is a module.

babel-preset-o with options

module.exports = { presets: [['babel-preset-o', { targets: {}, modules: 'commonjs' }]] }

Options are passed as second element in an array within presets.

customize runtime

wrong

module.exports = { presets: ['babel-preset-o', { runtime: 'automatic' }] }

correct

module.exports = { presets: [['babel-preset-o', { runtime: 'automatic' }]] }

When passing options, wrap the preset name and options in a sub-array.

Quickstart

Shows how to install and configure babel-preset-o with custom targets and options for React development.

// Install: npm i -D babel-preset-o
// babel.config.js
module.exports = {
  presets: [
    ['babel-preset-o', { 
      targets: { browsers: ['> 1%', 'last 2 versions'] },
      modules: false,
      useBuiltIns: false,
      runtime: 'classic' 
    }]
  ]
}