Hyperscript reviver that constructs a sanitized HTML string.
npm install vhtml

> Need to use HTML strings (angular?) but want to use JSX? vhtml's got your back.
>
> Building components? do yourself a favor and use
---
Via npm:
npm install --save vhtml
---
``js
// import the library:
import h from 'vhtml';
// tell babel to transpile JSX to h() calls:
/* @jsx h /
// now render JSX to an HTML string!
let items = ['one', 'two', 'three'];
document.body.innerHTML = (
Here is a list of {items.length} items:
$3
vhtml intentionally does not transform JSX to a Virtual DOM, instead serializing it directly to HTML.
However, it's still possible to make use of basic Pure Functional Components as a sort of "template partial".When
vhtml is given a Function as the JSX tag name, it will invoke that function and pass it { children, ...props }.
This is the same signature as a Pure Functional Component in react/preact, except children is an Array of already-serialized HTML strings.This actually means it's possible to build compositional template modifiers with these simple Components, or even higher-order components.
Here's a more complex version of the previous example that uses a component to encapsulate iteration items:
`js
let items = ['one', 'two'];const Item = ({ item, index, children }) => (
{item}
{children}
);console.log(
Hi!
{ items.map( (item, index) => (
This is item {item}!
)) }
);
`The above outputs the following HTML:
`html
Hi!
one
This is item one!
two
This is item two!
``