h2x-core

1.1.1 verified Fri May 01 auth: no javascript

h2x-core is the core compiler for h2x, an HTML-to-JSX transformer. It converts HTML strings into a JavaScript AST (JSX) via JSDOM, using a plugin system for extensibility. Version 1.1.1 is current, with releases every few months. Key differentiators: leverages JSDOM for robust parsing, supports state, and has a plugin architecture. It handles special SVG attributes and style attributes. Alternatives are typically SVGR or manual transformation.

Common errors

error Error: Cannot find module 'h2x-core' ↓

cause h2x-core not installed or not imported correctly.

fix

Run npm install h2x-core and ensure import path is correct: import { compile } from 'h2x-core'.

error TypeError: compile is not a function ↓

cause Mis-imported default export vs named export.

fix

Use named import: import { compile } from 'h2x-core'.

error Error: JSDOM is not defined ↓

cause jsdom peer dependency not installed.

fix

Run npm install jsdom@12.

Warnings

breaking v1.0.0: AST generation changed from a custom tree to JSDOM-based tree. You must use fromHtmlAttribute and fromHtmlElement for node replacement. originalNode property available. ↓

fix Update code to use new API: node.originalNode, fromHtmlAttribute, fromHtmlElement.

gotcha The package does not include any default plugin; you must provide plugins (e.g., h2x-plugin-jsx) for meaningful output. ↓

fix Install and pass plugins: e.g., `compile(html, { plugins: [require('h2x-plugin-jsx')] })`.

gotcha JSDOM v12+ required; older JSDOM versions may cause parse errors. ↓

fix Ensure jsdom >=12 is installed.

deprecated In v0.x, the API exported a different set of functions. Direct migration may break. ↓

fix Update to v1.x API (compile, transform, parse).

Install

npm install h2x-core

yarn add h2x-core

pnpm add h2x-core

Imports

compile
wrong
```
const { compile } = require('h2x-core')
```
correct
```
import { compile } from 'h2x-core'
```
Use ESM import. CommonJS require also works but is less common.
transform
wrong
```
import { transpile } from 'h2x-core'
```
correct
```
import { transform } from 'h2x-core'
```
The correct function name is 'transform', not 'transpile'.

parse

wrong

import { parseHtml } from 'h2x-core'

correct

import { parse } from 'h2x-core'

Direct 'parse' export. No submodule import.

Quickstart

Demonstrates how to compile HTML to JSX using a plugin.

import { compile } from 'h2x-core';
import pluginJsx from 'h2x-plugin-jsx';

const html = `<div class="foo">Hello</div>`;
const jsx = compile(html, {
  plugins: [pluginJsx],
  output: 'string'
});
console.log(jsx); // <div className="foo">Hello</div>