templite

Lightweight, minimalist Javascript templating

npm install templite
34 downloads in the last month

templite

Templite aims to be a very small and lightweight, javascript template rendering engine. It can be used standalone, in node, bower or with ender.

Installation

# With npm
npm install templite

# With bower
bower install templite

# With ender
ender add templite

Usage

templite.render( string, object );

Root properties

This format parses properties directly from the root data object. Note the leading dot notation.

<h1>{{.name}}</h1>
<h2>{{.stats.kickflips}}</h2>
templite.render( html, {
    name: "kitajchuk",
    stats: {
        kickflips: 37
    }
});

Hash conditions

This format uses the mustache style hash syntax for iteration and/or defined or not null.

{{#dude}}
    <h3>{{name}}</h3>
    <h4>{{age}}</h4>

    {{#stats}}
    <p>{{power}}</p>
    <p>{{transport}}</p>
    {{/stats}}
{{/dude}}
templite.render( html, {
    dude: {
        age: 27,
        name: "kitajchuk",
        stats: {
            power: null,
            transport: "skateboard"
        }
    }
});

Functions

If a tag represents a function, it will be called.

<h1>{{.pi}}</h1>
templite.render( html, {
    pi: function () {
        return Math.PI;
    }
});

Array iterations

This format allows using a single {{.}} tag to print the current array index.

<!-- Print current array index if string -->
{{#dudes}}
    <li>{{.}}</li>
{{/dudes}}

<!-- Print prop of current array index if object -->
{{#folks}}
    <li>{{name}}</li>
{{/folks}}
templite.render( html, {
    dudes: [
        "Him",
        "You",
        "Me"
    ],

    folks: [
        {name: "Scott"},
        {name: "Todd"},
        {name: "Neil"}
    ]
});

Testing

Node.js

# Render the template
node test/test.js

# Test with Grunt
grunt nodeunit

Browser

# Start the node server
node server/server.js

You should be able to go here localhost:5050

npm loves you