Registry / web-framework / babel-preset-solid

babel-preset-solid

library1.9.12jsnpmunverified

Babel preset that transforms JSX specifically for Solid.js, enabling Solid's fine-grained reactivity. Current stable version is 1.9.12, with v2.0.0 in beta. Released infrequently, tied to Solid core releases. Key differentiator: it is the official preset maintained by the Solid team, handling Solid's unique JSX runtime and providing optimizations for server-side rendering and hydration. Compared to generic JSX presets, it automatically injects Solid's runtime imports and supports Solid's control flow components.

web-framework

npm install babel-preset-solid

github ↗package ↗homepage ↗

INSTALL

IMPORT

SIG · BABEL-PRESET-SOLID

babel-preset-solid

web-frameworkjavascriptv1.9.12

Install

—

Import

—

Disk

—

Pass rate

0/ 6

Env Coverage0 / 6

glibc

18–22

musl

18–22

Install & Compatibility

Where this runs

tested against v? · npm install

Install × environment matrix

Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux

musl

node 18–226 runs

build_error

glibc

node 18–226 runs

build_error

Code

Verified usage

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

default

✓ module.exports = { presets: ['babel-preset-solid'] }

✗ import presets from 'babel-preset-solid'

This package is a Babel preset, not a JS module. It is used in Babel config files via CommonJS require.

solid-js/h

✓ import { h } from 'solid-js/h'

✗ import { h } from 'solid-js'

The h function is auto-imported by babel-preset-solid; manual import is not needed but possible for direct usage.

jsxDEV

✓ /* handled automatically by Babel */

✗ import { jsxDEV } from 'solid-js'

jsxDEV is an internal runtime symbol injected by Babel; never import it manually.

Shows minimal Babel config to enable Solid JSX transformation and a simple counter component.

// Install // npm install --save-dev babel-preset-solid @babel/core // npm install solid-js // babel.config.cjs module.exports = { presets: ['babel-preset-solid'] }; // App.jsx import { createSignal } from 'solid-js'; function Counter() { const [count, setCount] = createSignal(0); return ( <button onClick={() => setCount(c => c + 1)}> Count: {count()} </button> ); } export default Counter;

Debug

Known issues

deprecatedbabel-preset-solid v1.x is deprecated in favor of v2.0.0-beta

fix

Update to babel-preset-solid@^2.0.0-beta.0 or later.

affects: >=1.0.0 <2.0.0

gotchaThe preset automatically imports the JSX runtime; do not manually import 'jsx' or 'jsxDEV' from solid-js

fix

Remove any manual import of jsx/jsxDEV and rely on the Babel preset.

affects: >=1.0.0

breakingSolid 2.0 changes the JSX runtime; babel-preset-solid v2 is not backward-compatible with Solid 1.x

fix

Use babel-preset-solid@^1.x for Solid 1.x projects.

affects: >=2.0.0-beta.0

gotchaThis preset only works with Babel 7 or later; Babel 6 is not supported

fix

Upgrade to @babel/core@^7.0.0.

affects: >=1.0.0

Errors

Common errors & fixes

Error: Cannot find module 'solid-js' Require stack: ...

solid-js is not installed in node_modules

fix

npm install solid-js

SyntaxError: Unexpected token '<'

Babel preset not applied; JSX is not transformed

fix

Ensure babel-preset-solid is in your presets array and that Babel is configured correctly.

Module not found: Can't resolve 'babel-preset-solid'

babel-preset-solid is not installed as a devDependency

fix

npm install --save-dev babel-preset-solid

Upgrade

Version history

1.9.12latest on npm

Audit

Dependencies

solid-jsrequiredpeer dependency: required for JSX runtime and reactivity primitives

@babel/corerequiredpeer dependency: required for Babel transformation pipeline

Agent activity

9 hits · last 30 days

node

OpenAI (training)

Resources

githubhttps://github.com/solidjs/solid ↗

packagehttps://www.npmjs.com/package/babel-preset-solid ↗

homepagehttps://solidjs.com ↗