Over the last couple of months, I've been completely redesigning my template engine, Squirrelly.
I would love any feedback about how I could improve it or popularize it. Thank you!
Site: squirrelly.js.org
Github: github.com/nebrelbug/squirrelly
NPM: npmjs.com/package/squirrelly
Demo: cdn.rawgit.com/nebrelbug/squirrelly/d5fe714c/inde… (I'm serving it off of Rawgit since Codepen can be buggy)
It looks interesting, but I currently don't have time to test it :) I put it on my list, i cannot promise I will get to it within this year though :)
Tommy Hodgins: I looked into using template literals, but I wrote it the way I did for a couple of reasons:
{{if(options.num === 3)}}
Display this
{{#else}}
Display that
{{/if}}
is just a little bit easier for me than using ternary operators, like${num === 3 ? 'Display this' : 'Display that'}
That being said, your template engine looks really cool. I'll be sure to check it out sometime :).
Why not leverage ES template strings? From what I can see it would support the same features (interpolating global JS, passing individual helper functions in, etc) natively.
I've built a teeny tiny template engine around this, allowing me to consume any string at all, and treat it like an ES template string: github.com/tomhodgins/jsts-engine
function jstsEngine(string = '', environment = {}) { return new Function( ...Object.keys(environment), 'output={}', 'return [`' + string + '`, output]' )(...Object.values(environment)) }So I wonder what your template engine offers that ^ that template engine wouldn't support.
Here's an excerpt from a text file where I use it:
<ul class=toc> ${ galleries .map(gallery => ` <li> <a href=${site.url}gallery/${helpers.slug(gallery.title)}.html style="background-image: url(${helpers.randomArrayItem(gallery.images)});" > <span>${gallery.title}</span> </a> `) .join('\n') } </ul>So it can be used to template any language as well, here I'm templating HTML. Where you see things like
${gallery.title}that's reading a value directly, where you see things like${helpers.slug()}or${helpers.randomArrayItem()}you're seeing me run content through a JS helper function I also made available to the template engine. And as you can see here, it's all nestable too. You can interpolate inside the things you're interpolating too.