JSON Template Builder

The easiest way to create template (for example Vue template) from JSON object.
Also you can build DOM tree with it.

Installation

npm install json-template-builder

Help

createTree() - function.
1 argument - JSON object
returns DOM tree

treeToStringTemplate() - function.
2 arguments: DOM tree & parent tag
returns string representation of a given DOM tree wrapped in parent tag (default <template>)

json object example:

let model = {
    el: {
        tag: 'div',
        attrs: {'class': 'body-1', 'style': 'color: red;'},
        children: [
            {
                {
                    tag: 'span',
                    children: 'example text'
                }
            }
        ]
    }
};

minimal model:

let model = {
  el: {}
}

It`s equal to <div></div>.

tag - any js string which supported by HTML as tag-name; if empty then <div>.
attrs - object with pairs key-value, key is attribute name, value is attribute value; can be empty.
children - string or Array. if string use it as innerHTML of node. If Array - creates children nodes. Can be empty.
Root node in model should only be one and called as el.

Usage

import {createTree, treeToStringTemplate} from 'json-template-builder';

Contact

[email protected]