I'm using handlebars.js on a project and I'm starting to have a fair amount of templates. For now they are stored in my main template app file, like this :
<script id="avatar_tpl" type="text/html">
bla bla bla {{var}} bla bla bla
</script>
I'm wondering if there is a way to put them in a separate file like a .js file or something, to avoid stacking them up in my source code page.
I'm aware that there are several solutions to call theses templates via Ajax, but that seems to result in too much unnecessary requests for me.
Thank you
Mustache is a logic-less templating system. It permits you to use pre-written text files with placeholders that will be replaced at run-time with values particular to a given request.
What is Handlebars? Handlebars is a simple templating language. It uses a template and an input object to generate HTML or other text formats. Handlebars templates look like regular text with embedded Handlebars expressions.
Mustache is a logicless template engine for creating dynamic content like HTML, configuration files among other things.
I created and open-sourced NodeInterval for this exact same problem of too many js templates in my HTML page.
It allows you to put all your templates into a templates folder organized in whatever hierarchy you like. It has a built in watch
capability so that as you modify any of these templates it automatically updates your HTML page. I use it alongside SASS for my CSS.
I use it daily with underscore templates but it should work fine with moustache templates as well:
https://github.com/krunkosaurus/NodeInterval
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With