template engine - Preprocessing HTML files -


i'm evaluating brunch build system needs. need make simple html preprocessing. need produce several files common headers , footers:

file1.html:

<html> <head> <title>title1</title> </head> <body> <div id="content">   <div id="header">...</div>   page1   <div id="footer">...</div> </div> </body> </html> 

file2.html:

<html> <head> <title>title2</title> </head> <body> <div id="content">   <div id="header">...</div>   page2   <div id="footer">...</div> </div> </body> </html> 

so either simple include functionality or (preferrable) kind of extends functionality. ideally syntax should hide in comments ide won't complain non-html characters. liked preprocess javascript library, that's not necessary, of course.

unfortunately didn't find suited task in brunch. there's support many html template engines, seem generate js functions. need simple static html result, not javascript spa.

i'm not there's built-in solution yet, if go in direction of html templates / partials, i'd either "after-brunch" , "before-brunch" plugins on npm.

i don't know what's program-language of choice filesystem manipulation (read, merge, write, etc.), in theory use "before-brunch" execute batch / shellscript / or command of somekind collect html partials file1.html, file2.html, ... before brunch compiles , copies public/ folder.

enter image description here

in case you're familiar haxe, here's gist shared while ago. it's post-process script merge other files on specific lines of documents.

https://gist.github.com/bigp/90e38deeccc94145b033

here's html document like:

<!doctype html> <html lang="en"> <head>     <meta charset="utf-8">     <title>demo</title>     <link rel="icon" href="data:;base64,=">     <style id="css" type="text/css" rel="stylesheet">         /* @macromerge: public/app.css */ //<--- merges css here..     </style> </head> <body>     <script type="text/javascript">         /* @macromerge: public/vendor.js, public/app.js */ //<--- , js here..     </script> </body> </html> 

edit:

almost forgot, here's how brunch-config.coffee script use haxe script after-brunch plugin:

plugins:     afterbrunch: [         "haxe -cp . --macro macromerge.html('app/index.template.html','public/index.html')"     ] 

come think of it... nothing stops taking example , specifying html partials (or file extension really, ex: *.txt, *.xml) wherever need them. again, might useful if you're familiar haxe. if not, it's open-sourced & free download (http://haxe.org/download/).


Comments