Registry / web-framework / babel-plugin-transform-redom-jsx

babel-plugin-transform-redom-jsx

library3.0.6jsnpmunverified

A Babel plugin that transforms JSX into RE:DOM element creation calls (el, text). Current stable version is 3.0.6. The plugin converts JSX syntax to RE:DOM's el() function calls, with support for component classes and this-assignment for direct DOM access. It requires Babel 7+ and is used alongside @babel/plugin-transform-react-jsx (or similar) with a pragma set to 'el'. Unlike generic JSX-to-hyperscript transforms, this plugin is specifically optimized for RE:DOM's reactive DOM patching and component lifecycle.

web-framework serialization

npm install babel-plugin-transform-redom-jsx

github ↗package ↗

INSTALL

IMPORT

SIG · BABEL-PLUGIN-TRANS

babel-plugin-transform-redom-jsx

web-frameworkjavascriptv3.0.6

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

✓ import plugin from 'babel-plugin-transform-redom-jsx'

This is a Babel plugin, typically used in .babelrc config string, not imported directly.

✓ import { el } from 'redom'

✗ import { el } from 'babel-plugin-transform-redom-jsx'

el is from the redom package, this plugin transforms JSX to el calls.

text

✓ import { text } from 'redom'

✗ import { text } from 'babel-plugin-transform-redom-jsx'

text is from redom package; plugin transforms JSX text nodes to text() calls.

Shows minimal Babel config and a RE:DOM component using JSX transformed to el() calls.

// .babelrc { "plugins": [ "babel-plugin-transform-redom-jsx", ["@babel/plugin-transform-react-jsx", { "pragma": "el" }] ] } // App.js import { el, mount } from 'redom'; class Hello { constructor() { <div this="el"> <h1>Hello, World!</h1> </div>; } } mount(document.body, <Hello />);

Debug

Known issues

breakingv3.0.0 changed handling of component JSX. Use <Component /> syntax, not special handling.

fix

Update JSX to standard component usage; see README for examples.

affects: >=3.0.0

breakingv2.0.0 requires Babel 7+. Babel 6 is not supported.

fix

Upgrade to Babel 7 or use v1.x.

affects: >=2.0.0

deprecatedOld v1.x patterns using special handling for component JSX are removed in v2.0.0.

fix

Update JSX to use standard component pattern from v2.0.0+.

affects: <2.0.0

gotchaYou must also include @babel/plugin-transform-react-jsx (or equivalent) with pragma 'el'.

fix

Add both plugins to Babel config as shown in README.

affects: all

Errors

Common errors & fixes

Unknown plugin "babel-plugin-transform-redom-jsx"

Plugin not installed or Babel config not recognized.

fix

npm install --save-dev babel-plugin-transform-redom-jsx and ensure .babelrc is correct.

ReferenceError: el is not defined

el function not imported from redom.

fix

Add 'import { el } from "redom";' to your file.

Support for the experimental syntax 'jsx' isn't currently enabled

Missing @babel/plugin-transform-react-jsx or stale Babel config.

fix

Add @babel/plugin-transform-react-jsx with pragma 'el' to your plugins.

Upgrade

Version history

3.0.6latest on npm

Audit

Dependencies

@babel/corerequiredPeer dependency needed for Babel plugin compatibility

@babel/plugin-syntax-jsxrequiredPeer dependency needed to parse JSX syntax

Agent activity

23 hits · last 30 days

node

Amazon

OpenAI (training)

Resources

githubhttps://github.com/tomerigal/babel-plugin-transform-redom-jsx ↗

packagehttps://www.npmjs.com/package/babel-plugin-transform-redom-jsx ↗