❤
npm
Sign UpSign In

gotpl

8.4.5 • Public • Published

gotpl

Build Status Coverage Status Version License Dependencies DevDependencies

A lightweight, high-performance JavaScript template engine.

Installation

Webpack/Browserify

npm install gotpl --save

Direct <script> Include

Simply download and include with a script tag. playable will be registered as a global variable.

CDN

<script src="https://cdn.jsdelivr.net/npm/gotpl/dist/gotpl.min.js"></script>

You can browse the source of the NPM package at cdn.jsdelivr.net/npm/gotpl.

Test

$ npm run test

You can also check the test report in your browser.

Examples

Online Example

<h1>Projects</h1>
<ul id="list"></ul>
 
<% if (projects.length) { %>
    <% for (var i = 0, l = projects.length; i < l; ++i) { %>
        <% var item = projects[i]; %>
        <li class="item">
            <a target="_blank" href="<%=item.url%>"><%= item.name %></a>
        </li>
    <% } %>
<% } %>

Usages

Browser

var data = {
    projects: [{
        "name": "gotpl",
        "url": "https://github.com/Lanfei/gotpl"
    }, {
        "name": "playable.js",
        "url": "https://github.com/Lanfei/playable.js"
    }, {
        "name": "webpack-isomorphic",
        "url": "https://github.com/Lanfei/webpack-isomorphic"
    }, {
        "name": "websocket-lib",
        "url": "https://github.com/Lanfei/websocket-lib"
    }, {
        "name": "node-cd-cluster",
        "url": "https://github.com/Lanfei/node-cd-cluster"
    }]
};
var tpl = document.getElementById('tpl').innerHTML;
document.getElementById('list').innerHTML = gotpl.render(tpl, data);

Node

gotpl.config(options);
 
gotpl.render(template, data, options);
 
gotpl.renderFileSync(path, data, options);
 
gotpl.renderFile(path, data, options, (err, html) => {
    // Your codes.
});
 
await gotpl.renderFile(path, data, options);
 
// Cache the compiled function
let fn = gotpl.compile(template, options);
fn(data);

Express

app.engine('tpl', template.renderFile);
app.set('view engine', 'tpl');

Options

  • root The root of template files
  • scope Rendering context, defaults to global in node, window in browser
  • debug Enable debug information output, defaults to false
  • cache Enable caching, defaults to true
  • minify Minify indents, defaults to true
  • openTag Open tag, defaults to <%
  • closeTag Close tag, defaults to %>

Tags

  • <% code %> Logic code
  • <%= value => Output the value as escaped HTML
  • <%- value %> Output the value as unescaped HTML

includes

Use include(path[, data, options]) function to import partial templates, and use <%- value %> tag to output:

<h1>Projects</h1>
<ul id="list"></ul>
 
<% if (projects.length) { %>
    <% for (var i = 0, l = projects.length; i < l; ++i) { %>
        <%- include('project', projects[i]) %>
    <% } %>
<% } %>

Readme

Keywords

Package Sidebar

Install

npm i gotpl

Repository

github.com/Lanfei/gotpl

Homepage

github.com/Lanfei/gotpl

Weekly Downloads

26

Version

8.4.5

License

MIT

Unpacked Size

48.6 kB

Total Files

8

Last publish

Collaborators

  • clanfei
Try on RunKit
Report malware