# antihtml

> Simple structured HTML serializer

Latest version **0.3.0** (published 2025-01-21) · MIT license · 0 weekly downloads

## Install

```sh
npm install antihtml
pnpm add antihtml
yarn add antihtml
bun add antihtml
```

## Health

**Score 30/100 (F)** — status: maintenance-mode.

Positive: esm support; no vulnerabilities.

Warnings: low downloads; no types; pre 1.0.

Negative: stale; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.3.0 |
| Published | 2025-01-21 |
| First published | 2019-08-24 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | ESM |
| Dependencies | 0 |
| Unpacked size | 39.3 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | Hornwitser |
| Maintainers | hornwitser |
| Keywords | html, serialize |

## Links

- npm: https://www.npmjs.com/package/antihtml
- Repository: https://github.com/Hornwitser/antihtml
- Homepage: https://github.com/Hornwitser/antihtml#readme
- Issues: https://github.com/Hornwitser/antihtml/issues
- npm.io page: https://npm.io/package/antihtml

## Alternatives

- [@tsparticles/shape-image](https://npm.io/package/@tsparticles/shape-image.md) — 303.7K weekly downloads
- [@tsparticles/shape-line](https://npm.io/package/@tsparticles/shape-line.md) — 233.7K weekly downloads
- [stringify-attributes](https://npm.io/package/stringify-attributes.md) — 58.6K weekly downloads
- [mobile-drag-drop](https://npm.io/package/mobile-drag-drop.md) — 46.3K weekly downloads
- [@comunica/actor-rdf-parse-html](https://npm.io/package/@comunica/actor-rdf-parse-html.md) — 29.2K weekly downloads

## Recent versions

- 0.3.0 (latest) — 2025-01-21
- 0.2.0 — 2024-04-05
- 0.1.0 — 2019-08-24

## README

# AntiHTML

The simple stupid data structure oriented HTML serializer.

## Simple exaple

```js
import { el, htmlDocument, prettify } from 'antihtml';

const title = "Hello world";
const document = el('html',
    el('head',
        el('meta', {'charset': 'utf-8'}),
        el('title', title),
    ),
    el('body',
        el('h1', title),
        el('p', "This is a sample html document"),
    ),
);
const html = htmlDocument(prettify(document, "    "));
```

The produced `html` string is the following:

```html
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>Hello world</title>
    </head>
    <body>
        <h1>Hello world</h1>
        <p>This is a sample html document</p>
    </body>
</html>
```

## JSX support

Using JSX is also supported, for example with JSX the above code could also have been written as:

```jsx
import { htmlDocument, prettify } from 'antihtml';

function Head(props) {
    return <head>
        <meta charset="utf-8" />
        <title>{props.title}</title>
    </head>;
}

const title = "Hello world";
const document = <html>
    <Head title={title} />
    <body>
        <h1>{title}</h1>,
        <p>This is a sample html document</p>
    </body>
</html>;
const html = htmlDocument(prettify(document, "    "));
```

For this to work you need to configure a transpiler to convert the JSX to `_jsx` calls, with the source to import it from set to `"antihtml"`.
In TypeScript this can be accomplished with a tsconfig.json containing the following options:

```json
{
    "compilerOptions": {
        "jsx": "react-jsx",
        "jsxImportSource": "antihtml"
    }
}
```

---
_Source: https://npm.io/package/antihtml · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._
