babelify

10.0.0 verified Sat Apr 25 auth: no javascript

Babel browserify transform that compiles JavaScript files using Babel during browserify bundling. Current stable version is 10.0.0, released on an as-needed basis. Supports Babel 7 with @babel/core as a peer dependency. Differentiates from other Babel integrations by tight coupling with browserify's transform pipeline, allowing per-file compilation with source maps and custom file extensions. Requires user-supplied presets/plugins for any transformation since Babel 6.

Common errors

error Error: Cannot find module '@babel/core' ↓

cause @babel/core is a required peer dependency not installed.

fix

Run 'npm install --save-dev @babel/core'

error Error: Requires Babel "^7.0.0-0", but was loaded with "6.x.x" ↓

cause babelify v10 requires Babel 7, but an older babel-core is installed.

fix

Install @babel/core v7 and remove babel-core.

error SyntaxError: Unexpected token import (or JSX) - no presets configured ↓

cause Babel 6+ requires presets to transform modern JS/JSX; none provided.

fix

Add presets like @babel/preset-env and @babel/preset-react to babelify options.

Warnings

breaking babelify v10 requires @babel/core (Babel 7) as a peer dependency; v8 used babel-core (Babel 6). ↓

fix Install @babel/core instead of babel-core. Update presets/plugins to @babel/* scope.

breaking In Babel 6 and later, no plugins are included by default. You must install and configure presets/plugins explicitly. ↓

fix Install presets like @babel/preset-env and specify them in options.

deprecated babelify v8 (Babel 6) is no longer maintained; upgrade to v10 with Babel 7. ↓

fix Upgrade babelify to v10 and switch to @babel/core.

gotcha If you pass the babelify transform as a function (configure) rather than string, you must ensure it's required correctly. Using bind or .call may cause issues. ↓

fix Prefer using the string name 'babelify' in transform() to avoid context issues.

gotcha The `ignore` option is a regex that when matched skips compilation; common mistake: using a string instead of RegExp. ↓

fix Pass a RegExp object, e.g., /node_modules/.

Install

npm install babelify

yarn add babelify

pnpm add babelify

Imports

babelify (default)
wrong
```
const babelify = require('babelify')
```
correct
```
import babelify from 'babelify'
```
ESM import works; CommonJS require also OK, but ESM is modern.
babelify.configure
wrong
```
const configure = require('babelify').configure
```
correct
```
import { configure } from 'babelify'
```
configure is a named export; CommonJS pattern works but named import is cleaner.

transform usage

wrong

browserify().transform(babelify, { presets: [...] }) // also correct, but string form is more common

correct

browserify().transform('babelify', { presets: ['@babel/preset-env'] })

Can pass package name string or the require'd transform function.

Quickstart

Shows how to set up babelify with browserify, using configure() and specifying presets for ES6+ and React JSX.

import browserify from 'browserify';
import fs from 'fs';
import babelify from 'babelify';

const b = browserify('./src/index.js');
b.transform(babelify.configure({
  presets: ['@babel/preset-env', '@babel/preset-react'],
  extensions: ['.js', '.jsx']
}));
b.bundle()
  .pipe(fs.createWriteStream('./dist/bundle.js'));