Skip to content

snabbdom/snabbdom-to-html

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Apr 29, 2022
f2725f9 · Apr 29, 2022
Jun 29, 2021
Apr 29, 2022
Nov 10, 2017
Feb 21, 2016
Aug 23, 2016
Aug 29, 2016
Apr 29, 2022
Jan 22, 2018
May 16, 2018
Apr 29, 2022
Apr 29, 2022

Repository files navigation

Snabbdom to HTML

Render Snabbdom Vnode’s to HTML strings

Install

With npm do:

npm install snabbdom-to-html

Usage

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.

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 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 to ensure Map support.

License

MIT