babel-standalone

6.26.0 verified Sat Apr 25 auth: no javascript deprecated

babel-standalone provides a standalone build of Babel (v6.26.0) for use in non-Node.js environments, primarily browsers. It bundles all standard Babel plugins and presets, including an optional babili (babel-minify) build. Unlike the Babel CLI or module-based usage, this package requires no build step — it exposes a global Babel object and can automatically transpile script tags with type="text/babel" or "text/jsx". It is ideal for REPLs, JSFiddle-like sites, or embedding JavaScript scripting in apps. Note that this is based on Babel 6; Babel 7+ has its own @babel/standalone package with a different API.

Common errors

error Babel is not defined ↓

cause Library not loaded or loaded after script calling Babel.

fix

Load babel-standalone script before any script that references Babel. Ensure the URL is correct: <script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>

error Uncaught TypeError: Cannot read property 'transform' of undefined ↓

cause Babel is not loaded (likely due to network issue or wrong CDN URL).

fix

Verify the CDN URL or download the file and host locally. Use a reliable CDN like unpkg or cdnjs.

error Module build failed: Error: Couldn't find preset "es2015" relative to directory ↓

cause Preset not specified correctly; babel-standalone does not read .babelrc.

fix

Pass preset in options: Babel.transform(input, { presets: ['es2015'] }) or use data-presets="es2015" in script tags.

Warnings

deprecated babel-standalone is based on Babel 6, which is deprecated in favor of Babel 7+. Use @babel/standalone for newer features and security updates. ↓

fix Switch to @babel/standalone. Update script source to https://unpkg.com/@babel/standalone/babel.min.js and adjust API usage (e.g., Babel.transform -> Babel.transformSync).

breaking In v6.24.0, the automatic execution of script tags with type text/babel was fixed to work with async transforms. Users relying on synchronous behavior may break. ↓

fix Ensure code inside script tags handles asynchronous execution if needed, or switch to explicit Babel.transformSync.

gotcha The package does not load .babelrc files; all presets/plugins must be specified inline via data-attributes or in the transform options. ↓

fix Specify presets in the script tag: <script type="text/babel" data-presets="es2015"> or in Babel.transform({presets: ['es2015']}).

gotcha Script tags with external src attribute may not work as expected in older browsers; XHR fallback might be needed. ↓

fix Upgrade to v6.24.0+ or use inline scripts only.

Install

npm install babel-standalone

yarn add babel-standalone

pnpm add babel-standalone

Imports

Babel
wrong
```
const Babel = require('babel-standalone')
```
correct
```
<script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>
```
This package is intended for browsers and adds Babel as a global. In Node.js, use @babel/core instead. For ESM imports in modern bundlers, consider @babel/standalone.
transform
wrong
```
Babel.transform(code)
```
correct
```
Babel.transform(code, options)
```
The transform method is called on the global Babel object. Options must include presets or plugins; omitting them results in no transformation.
registerPlugin
```
Babel.registerPlugin('pluginName', pluginFunction)
```
Registers a custom plugin for use in subsequent transforms. The plugin name is then used in presets/plugins options. Available in v6.22+.

Quickstart

Loads babel-standalone from CDN and uses inline script tag with type text/babel to automatically transpile ES2015 arrow function.

<!DOCTYPE html>
<html>
<body>
<script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>
<script type="text/babel">
const getMessage = () => "Hello World";
document.write(getMessage());
</script>
</body>
</html>