Registry / devops / babel-preset-react-optimised

babel-preset-react-optimised

library1.0.0jsnpmunverified

A Babel preset that replaces React.createElement and React.createFragment with shorter local variable aliases (__jsx, __jsxFrag) to reduce minified bundle size. Current stable version is 1.0.0. This preset is a drop-in replacement for @babel/preset-react, offering a ~10% size reduction on typical React components. It is designed for production builds where every byte counts, but note that it reserves the variable names __jsx and __jsxFrag. The preset relies on @babel/core as a peer dependency and has no other dependencies. It is compatible with React JSX transforms and can be customized via pragma and pragmaFrag options.

devops

npm install babel-preset-react-optimised

package ↗

INSTALL

IMPORT

SIG · BABEL-PRESET-REACT

babel-preset-react-optimised

devopsjavascriptv1.0.0

harness data pending

Install & Compatibility

Where this runs

No compatibility data collected yet for this library.

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

preset

✓ module.exports = { presets: ['babel-preset-react-optimised'] };

✗ import preset from 'babel-preset-react-optimised'

This is a Babel preset, not a JS import. It is used in .babelrc or babel.config.js, not imported in application code.

Configures babel-preset-react-optimised in babel.config.js, shows installation and basic build command.

// In babel.config.js module.exports = { presets: [ ['babel-preset-react-optimised', { pragma: 'React.createElement', // optional, default pragmaFrag: 'React.Fragment', // optional, default }], ], env: { development: { presets: [['babel-preset-react-optimised', { development: true }]], }, }, }; // Run: npm install --save-dev babel-preset-react-optimised @babel/core // Then build: npx babel src --out-dir lib // The preset replaces React.createElement with __jsx, reducing size.

Debug

Known issues

gotchaReserved variable names __jsx and __jsxFrag conflict with any existing variables with those names in your code.

fix

Use 'pragmaAs' and 'pragmaFragAs' options to rename them (e.g., pragmaAs: 'h').

affects: >=1.0.0

Errors

Common errors & fixes

Error: Cannot find module '@babel/core'

@babel/core is a peer dependency but not installed.

fix

npm install --save-dev @babel/core

Error: __jsx is not defined

The injected variable __jsx is not scoped properly or the preset is not applied.

fix

Ensure babel-preset-react-optimised is in your Babel presets list.

Upgrade

Version history

1.0.0latest on npm

Audit

Dependencies

No dependency data recorded yet.

Agent activity

4 hits · last 30 days

node

Resources

packagebabel-preset-react-optimised ↗