# preact-html

> Turn HTML strings into Preact VNodes

Latest version **2.0.3** (published 2018-03-04) · 0 weekly downloads

## Install

```sh
npm install preact-html
pnpm add preact-html
yarn add preact-html
bun add preact-html
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 2.0.3 |
| Published | 2018-03-04 |
| First published | 2016-09-23 |
| Weekly downloads | 0 |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 2 |
| Unpacked size | 166.7 KB |
| Known vulnerabilities | 0 (+16 in 1 direct dependencies) |
| Install scripts | no |
| GitHub stars | 5 |
| Author | Matthew Mueller |
| Maintainers | mattmueller |

## Links

- npm: https://www.npmjs.com/package/preact-html
- Repository: https://github.com/MatthewMueller/preact-html
- Homepage: https://github.com/MatthewMueller/preact-html#readme
- Issues: https://github.com/MatthewMueller/preact-html/issues
- npm.io page: https://npm.io/package/preact-html

## Dependencies (2)

- [preact](https://npm.io/package/preact.md) ^8.2.7
- [xmldom](https://npm.io/package/xmldom.md) 0.1.22

## Recent versions

- 2.0.3 (latest) — 2018-03-04
- 2.0.2 — 2016-12-05
- 2.0.1 — 2016-10-03
- 2.0.0 — 2016-09-28
- 1.0.2 — 2016-09-26
- 1.0.1 — 2016-09-23
- 1.0.0 — 2016-09-23

## README

# preact-html

  Turn HTML strings into Preact VNodes. The functional version of [preact-markup](https://github.com/developit/preact-markup).

## Why

  This satisifies my use case of being able to modify vnodes before render. If you'd like to replace class names on the markup, you may want to try this library, otherwise I'd probably go with the better tested [preact-markup](https://github.com/developit/preact-markup).

## Usage

```js
const { CSS, HTML, render } = require('vcom')
const html = require('preact-html')

const css = CSS(`
  .blue {
    background: blue;
  }
`)

const vnodes = html('<h2 class="blue"><strong>hi there!</strong></h2>', {
  h2 (props) {
    return HTML.h3.class(props.class)(props.children)
  }
})

const div = css(HTML.div(vnodes))
render(div, document.body)
// <div><h3 class="_1nxhvta"><strong>hi there!</strong></h3></div>
```

## Credits

  [@developit](https://github.com/developit) wrote 99% of this.

## License

MIT

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