This module allows native ES6 template literals to be used with DADI Web.
-
Add this module as a dependency:
npm install @dadi/web-es6-templates --save
-
Include it in the
engines
array passed to Web:require('@dadi/web')({ engines: [ require('@dadi/web-es6-templates') ] })
The base directory for absolute paths is the utils/helpers
directory.
Helpers are required()
functions that can be embeded into templates to keep your code DRY. Take this example which could live in your helpers
folder as slugify.js
.
var s = require('underscore.string/slugify')
module.exports = slugify = (chunk) => {
return s(chunk)
}
This function would be used in a template file like so:
${slugify('The Quick Brown Fox Jumps Over The Lazy Dog')}
Output:
the-quick-brown-fox-jumps-over-the-lazy-dog
The base directory for absolute paths is the pages/
directory. Take the following directory tree.
pages/
|_ partials/
|_ |_ header.js
|_ |_ footer.js
|_ index.js
|_ index.json
To include the partials from index.js
, you can use an underscore to indicate a sub-folder:
${partials_header}
<h1>ES6 Templates test</h1>
<p>This page lives at ${host}.</p>
<h2>Loop test</h2>
<ul>
${posts.results.map(i => '<li>' + i.attributes.title + '</li>').join('')}
</ul>
${partials_footer}