gotpl
A lightweight, high-performance JavaScript template engine.
Installation
Webpack/Browserify
npm install gotpl --save
<script>
Include
Direct Simply download and include with a script tag. playable
will be registered as a global variable.
CDN
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
<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 = documentinnerHTML;documentinnerHTML = gotpl;
Node
gotpl; gotpl; gotpl; gotpl; await gotpl; // Cache the compiled functionlet fn = gotpl;;
Express
app;app;
Options
root
The root of template filesscope
Rendering context, defaults toglobal
in node,window
in browserdebug
Enable debug information output, defaults tofalse
cache
Enable caching, defaults totrue
minify
Minify indents, defaults totrue
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]) %> <% } %><% } %>