remark-vdom 
remark-vdom compiles markdown to Virtual DOM. Built on remark, an extensively tested and pluggable markdown parser.
- Inherently safe and sanitized: there is no way to pass raw HTML through.
- Supports footnotes, todo lists;
- Support VNode keys;
- Custom components overwriting default elements
(
MyLinkinstead of<a>);
Installation
npm:
npm install remark-vdomremark-vdom is also available as an AMD, CommonJS, and globals module, uncompressed and compressed.
Usage
Dependencies:
var remark = ;var vdom = ;Process:
var vtree = contents;Yields (note it’s an array of nodes):
VirtualNode { tagName: 'DIV', properties: { key: undefined }, children: [ VirtualNode { tagName: 'P', properties: { key: undefined }, children: [ VirtualNode { tagName: 'EM', properties: { key: undefined }, children: [ VirtualText { text: 'Emphasis' } ], key: 'h-3', namespace: null, count: 1, hasWidgets: false, hasThunks: false, hooks: undefined, descendantHooks: false }, VirtualText { text: ', ' }, VirtualNode { tagName: 'STRONG', properties: { key: undefined }, children: [ VirtualText { text: 'importance' } ], key: 'h-4', namespace: null, count: 1, hasWidgets: false, hasThunks: false, hooks: undefined, descendantHooks: false }, VirtualText { text: ', and ' }, VirtualNode { tagName: 'CODE', properties: { key: undefined }, children: [ VirtualText { text: 'code' } ], key: 'h-5', namespace: null, count: 1, hasWidgets: false, hasThunks: false, hooks: undefined, descendantHooks: false }, VirtualText { text: '.' } ], key: 'h-2', namespace: null, count: 9, hasWidgets: false, hasThunks: false, hooks: undefined, descendantHooks: false } ], key: 'h-1', namespace: null, count: 10, hasWidgets: false, hasThunks: false, hooks: undefined, descendantHooks: false }API
remark().use(vdom[, options])
Compiles markdown to Virtual DOM.
options
options.sanitize
How to sanitise the output (Object, default: null).
An object can be passed, in which case it’s passed to
hast-util-sanitize. By default, input is sanitised
according to GitHub’s sanitation rules, with the addition
that all embedded HTML is also stripped.
options.prefix
Optimisation hint (string, default: h-).
options.h
Hyperscript to use (Function, default: require('virtual-dom/h')).
options.components
Map of tag-names to custom components (Object.<Function>, optional).
That component is invoked with tagName, props, and children.
It can return any VDOM compatible value (VNode, VText, Widget,
etc.). For example:
var components = { /* Ensure a default programming language is set. */ if !propsclassName propsclassName = 'language-js'; return ; }Integrations
Integrates with the same tools as remark-html.
