express-dot-engine
Advanced tools
Node.js engine using the ultra fast doT templating with support for layouts, partials and friendly for front-end web libraries (Angular, Ember, Backbone...)
Node.js engine using the ultra fast doT templating with support for layouts, partials. It's friendly for front-end web libraries (Angular, Ember, Backbone...)
The default settings of doT has been change to use [[ ]] instead of {{ }}. This is to support client side templates (Angular, Ember, ...). You can change it back by changing the Settings (see below).
[[ ]] by default, not clashing with {{ }} (Angular, Ember...)Install with npm
$ npm install express-dot-engine --save
Then set the engine in express
var engine = require('express-dot-engine');
...
app.engine('dot', engine.__express);
app.set('views', path.join(__dirname, './views'));
app.set('view engine', 'dot');
To use a different extension for your templates, for example to get better syntax highlighting in your IDE, replace 'dot' with your extension of choice. See express' documentation
app.engine('html', engine.__express);
app.set('views', path.join(__dirname, './views'));
app.set('view engine', 'html');
By default, the engine uses [[ ]] instead of {{ }} on the backend. This allows the use of front-end templating libraries that already use {{ }}.
[[ ]] for evaluation
[[= ]] for interpolation
[[! ]] for interpolation with encoding
[[# ]] for compile-time evaluation/includes and partials
[[## #]] for compile-time defines
[[? ]] for conditionals
[[~ ]] for array iteration
If you want to configure this you can change the exposed doT settings.
// doT settings
engine.settings.dot = {
evaluate: /\[\[([\s\S]+?)\]\]/g,
interpolate: /\[\[=([\s\S]+?)\]\]/g,
encode: /\[\[!([\s\S]+?)\]\]/g,
use: /\[\[#([\s\S]+?)\]\]/g,
define: /\[\[##\s*([\w\.$]+)\s*(\:|=)([\s\S]+?)#\]\]/g,
conditional: /\[\[\?(\?)?\s*([\s\S]*?)\s*\]\]/g,
iterate: /\[\[~\s*(?:\]\]|([\s\S]+?)\s*\:\s*([\w$]+)\s*(?:\:\s*([\w$]+))?\s*\]\])/g,
varname: 'layout, partial, locals, model',
strip: false,
append: true,
selfcontained: false,
};
You can specify the layout using yaml and refer to the section as you would from a model.
You can also define any extra configurations (like a page title) that are inherited to the master.
master.dot
<!doctype html>
<html lang="en">
<head>
<title>[[= layout.title ]]</title>
</head>
<body>
Hello from master.dot <br />
[[= layout.section1 ]] <br />
[[= layout.section2 ]]
</body>
</html>
index.dot
---
layout: master.dot
title: Index page
---
[[##section1:
Hello from index.dot
#]]
[[##section2:
Hello from index.dot again
#]]
<!doctype html>
<html lang="en">
<head>
<title>Index page</title>
</head>
<body>
Hello from master.dot <br />
Hello from index.dot <br />
Hello from index.dot again
</body>
</html>
CEO.dot
<!doctype html>
<html lang="en">
<head>
<title>[[= layout.title ]]</title>
</head>
<body>
Hello from CEO.dot <br />
[[= layout.section ]]
</body>
</html>
Boss.dot
---
layout: ceo.dot
---
[[##section:
Hello from Boss.dot <br />
[[= layout.section ]]
#]]
me.dot
---
layout: boss.dot
title: Page title
---
[[##section:
Hello from me.dot
#]]
<!doctype html>
<html lang="en">
<head>
<title>Boss page</title>
</head>
<body>
Hello from CEO.dot <br />
Hello from Boss.dot <br />
Hello from me.dot
</body>
</html>
Partials are supported. The path is relative to the path of the current file.
index.dot
<div>
Message from partial: [[= partial('partials/hello.dot') ]]
</div>
partials/hello.dot
<span>Hello from partial</span>
<div>
My partial says: <span>Hello from partial</span>
</div>
In your node application, the model passed to the engine will be available through [[= model. ]] in your template. Layouts and Partials also has access to the server models.
server.js
app.get('/', function(req, res){
res.render('index', { fromServer: 'Hello from server', });
});
view.dot
<div>
Server says: [[= model.fromServer ]]
</div>
<div>
Server says: Hello from server
</div>
Pro tip
If you want to make the whole model available in the client (to use in angular for example), you can render the model as JSON in a variable on the view.
<script>
var model = [[= JSON.stringify(model) ]];
</script>
You can provide custom helper properties or methods to your views.
server
var engine = require('express-dot-engine');
engine.helper.myHelperProperty = 'Hello from server property helper';
engine.helper.myHelperMethod = function(param) {
// you have access to the server model
var message = this.model.fromServer;
// .. any logic you want
return 'Server model: ' + message;
}
...
app.get('/', function(req, res) {
res.render('helper/index', { fromServer: 'Hello from server', });
});
view
<!doctype html>
<html lang="en">
<head>
<title>Helper example</title>
</head>
<body>
model: [[= model.fromServer ]] <br />
helper property: [[# def.myHelperProperty ]] <br />
helper method: [[# def.myHelperMethod('Hello as a parameter') ]] <br />
helper in view: [[# def.helperInView ]]
</body>
</html>
[[##def.helperInView:
Hello from view helper ([[= model.fromServer ]])
#]]
render(filename, model, [callback])renderString(templateStr, model, [callback])The callback is optional. The callback is in node style function(err, result) {}
Example
var engine = require('express-dot-engine');
var model = { message: 'Hello', };
// render from a file
var rendered = engine.render('path/to/file', model);
email.send('Subject', rendered);
// async render from template string
engine.renderString(
'<div>[[= model.message ]]</div>',
model,
function(err, rendered) {
email.send('Subject', rendered);
}
);
...
You can provide a custom template provider
server
function getTemplate(name, options, callback) {
var isAsync = callback && typeof callback === 'function',
template = '<div>custom template, you can store templates in the database</div>';
if(!isAsync){
return template;
}
callback(null, template);
};
app.get('/', function(req, res) {
res.render('helper/index', { getTemplate: getTemplate, });
});
Caching is enabled when express is running in production via the 'view cache' variable in express. This is done automatically. If you want to enable cache in development, you can add this
app.set('view cache', true);
$ npm install express-dot-engine
$ npm install express
$ node examples
Open your browser to http://localhost:2015
FAQs
Node.js engine using the ultra fast doT templating with support for layouts, partials and friendly for front-end web libraries (Angular, Ember, Backbone...)
The npm package express-dot-engine receives a total of 629 weekly downloads. As such, express-dot-engine popularity was classified as not popular.
We found that express-dot-engine demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 2 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Research
Four npm packages disguised as cryptographic tools steal developer credentials and send them to attacker-controlled Telegram infrastructure.
Security News
Ruby maintainers from Bundler and rbenv teams are building rv to bring Python uv's speed and unified tooling approach to Ruby development.
Security News
Following last week’s supply chain attack, Nx published findings on the GitHub Actions exploit and moved npm publishing to Trusted Publishers.