# snabbdom-to-html

> Render Snabbdom Vnodes to HTML strings

Latest version **7.1.0** (published 2022-04-29) · MIT license · 0 weekly downloads

## Install

```sh
npm install snabbdom-to-html
pnpm add snabbdom-to-html
yarn add snabbdom-to-html
bun add snabbdom-to-html
```

## Health

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

Positive: has types; no vulnerabilities; high quality score.

Warnings: low downloads; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 7.1.0 |
| Published | 2022-04-29 |
| First published | 2015-12-04 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | CommonJS |
| Dependencies | 7 |
| Unpacked size | 20.5 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 95 |
| Author | acstll |
| Maintainers | acstll, tylors |
| Keywords | virtual, dom, html, snabbdom |

## Links

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

## Dependencies (7)

- [parse-sel](https://npm.io/package/parse-sel.md) ^1.0.0
- [lodash.uniq](https://npm.io/package/lodash.uniq.md) ^4.5.0
- [lodash.escape](https://npm.io/package/lodash.escape.md) ^4.0.1
- [lodash.forown](https://npm.io/package/lodash.forown.md) ^4.4.0
- [lodash.remove](https://npm.io/package/lodash.remove.md) ^4.7.0
- [object-assign](https://npm.io/package/object-assign.md) ^4.1.0
- [lodash.kebabcase](https://npm.io/package/lodash.kebabcase.md) ^4.1.1

## 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

- 7.1.0 (latest) — 2022-04-29
- 3.0.0-beta.1 (beta) — 2016-08-29
- 7.0.0 — 2021-06-30
- 6.0.0 — 2020-04-13
- 5.1.1 — 2018-05-16
- 5.1.0 — 2018-01-24
- 5.0.0 — 2017-11-20
- 4.0.0 — 2017-11-10
- 3.3.0 — 2017-09-19
- 3.2.0 — 2017-06-05
- 3.1.1 — 2017-02-23
- 3.1.0 — 2017-02-13
- 3.0.1 — 2016-12-05
- 3.0.0 — 2016-10-31
- 3.0.0-beta.0 — 2016-08-23
- … 8 more at https://npm.io/package/snabbdom-to-html/versions

## README

# Snabbdom to HTML

Render [Snabbdom](https://github.com/paldepind/snabbdom) Vnode’s to HTML strings

## Install

With [`npm`](https://www.npmjs.com/) do:

```bash
npm install snabbdom-to-html
```

## Usage

```js
var h = require('snabbdom/h')
var toHTML = require('snabbdom-to-html')

var output = toHTML(
  h('div', { style: { color: 'red' } }, 'The quick brown fox jumps')
)

console.log(output)
// => <div style="color: red">The quick brown fox jumps</div>
```

### Advanced usage

This library is built replicating the modular approach used in Snabbdom. So you can do the following if you need to implement any custom functionality.

```js
var h = require('snabbdom/h')

var init = require('snabbdom-to-html/init')
var modules = require('snabbdom-to-html/modules')
var toHTML = init([
  modules.class,
  modules.props,
  modules.attributes,
  modules.style
])

var output = toHTML(
  h('div', { style: { color: 'lime' } }, 'over the lazy fox')
)

console.log(output)
// => <div style="color: lime">over the lazy fox</div>
```

The `init` function accepts an array of functions (modules). Modules have the following signature: `(vnode, attributes) => undefined`, where `attributes` is an [ES2015 Map](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map) instance.

You can do `attributes.set(key, value)`, `attributes.get(key)` and `attributes.delete(key)` and so on. You can check out the built-in modules to get the idea.

The built-in modules are available from `snabbdom-to-html/modules`, and these are:

- `attributes`
- `class`
- `props`
- `style`

## Support

This is tested against Node.js 4.x and up. If you need to run this in the browser you might need to include something like [`es6-shim`](https://github.com/paulmillr/es6-shim) to ensure `Map` support. 

## License

MIT

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