Skip to content

dadi/web-es6-templates

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

23 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

DADI Web

ES6 template engine interface

npm (scoped) Coverage Status Build Status JavaScript Style Guide

This module allows native ES6 template literals to be used with DADI Web.

Installation

  • 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')
      ]
    })

Usage

Helpers

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

Includes

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}

About

A ES6 template literals interface for DADI Web

Resources

Stars

Watchers

Forks

Packages

No packages published

Contributors 3

  •  
  •  
  •