doomify

Templates autoselecting dom elements. Based on jstify.

Usage no npm install needed!

<script type="module">
  import doomify from 'https://cdn.skypack.dev/doomify';
</script>

README

doomify

Auto-variablizing browserify plugin to require Mustache template files.

installation

Install from npm:

$ npm install doomify

usage

Use it as browserify transform module with -t:

$ browserify -t doomify main.js -o bundle.js

Or use it as browserify transform module in gulp:

browserify({
  entries: 'main.js',
  debug: true,
  transform: [
    'doomify'
  ]
});

Mustache template files (.dmt, .tpl, .html)

<!-- template.html -->
<div class="example">
  {{content}}
  <div class="button" data-doomify="exampleButton"></div>
</div>

Require inside main.js and invoke like Mustache template. Use it like DOM Element with cached nodes in object fields.

// main.js
var template = require('../../templates/template.html'); // Mustache template

// Append template with javascript
var templateDOM = template({content: 'Hello'}); // HTML DOM DocumentFragment
document.body.appendChild(templateDOM);

// Bind events
var templateButton = templateDOM.exampleButton // Cached HTML DOM Element Object
templateButton.addEventListener('click', function(){
  alert(1);
});