@fluixi/babel-plugin-jsx

Compiles JSX into fine-grained reactive DOM calls for Fluixi — no virtual DOM.

✨ Overview

@fluixi/babel-plugin-jsx is the compile-time half of Fluixi's JSX support. It transforms JSX at build time into direct, surgical DOM operations wired to signals — so updates touch only the nodes that actually change, with no diffing and no virtual DOM. It pairs with the runtime in @fluixi/jsx.

📦 Installation

pnpm add -D @fluixi/babel-plugin-jsx

🚀 Usage

babel.config.js

module.exports = {
  plugins: ['@fluixi/babel-plugin-jsx'],
};

Or via the automatic JSX runtime in tsconfig.json:

{
  "compilerOptions": {
    "jsx": "react-jsx",
    "jsxImportSource": "@fluixi/jsx"
  }
}

The plugin rewrites JSX such as:

<button onClick={() => setCount(c => c + 1)}>Count: {count()}</button>

into fine-grained DOM instructions that update only the text node bound to count().

📋 Requirements

• @babel/core ≥ 7.27
• Use together with @fluixi/jsx at runtime.

📄 License

MIT © Fluixi