otiai10 / gulp-gather

Respecting micro-templating

gulp-gather

Respecting micro-templating

why

• Want to use micro-templating in project without html
• Want to write and devide template for micro-templating by .html file

spec

Concat these .html fiels ...

<!-- ./tpl/foo.html -->
<a href="<%= url %>"><%= name %></a>

<!-- ./tpl/bar/baz.html -->
<% for ( var i = 0; i < users.length; i++ ) { %>
  <li><a href="<%=users[i].url%>"><%=users[i].name%></a></li>
<% } %>

To static pool like below

this.MicroTemplates = {
    "tpl/foo.html": "<a href=\"<%= url %>\"><%= name %></a>",
    "tpl/bar/baz.html": "<% for ( var i = 0; i < users.length; i++ ) { %>
  <li><a href=\"<%=users[i].url%>\"><%=users[i].name%></a></li>
<% } %>"
};

usage

gulpfile.js

var microtemplates = require('gulp-micro-templates');
gulp.task('microt',function(){
    gulp.src('./tpl/**/*.html')
    .pipe(microtemplates('all.js'))
    .pipe(gulp.dest('./build/tpl'));
});