This is a tool for converting a directory of Handlebars
templates into one .html
file.
It recursively does the following:
If it finds an index.hbs
file in a directory, it renders the template and passes all the .htm
files in that directory (direct children) to the template as a context object, using name of the file as key and contents of the file as value.
If no index.hbs
file is found in a directory, it just concatenates the .htm
files in that directory.
You can configure it to use different name patterns or extension for files.
Usage:
If we have the following directory:
somedir/
├─ index.hbs
├─ header.htm
└─ footer.htm
and our index.hbs
contained:
{{{ header }}} {{{ footer }}}
and contents of the header.htm
file were:
Header
and the footer.htm
file looked like this:
Footer
then after running: htmlbilder somedir
our index.html
would look like this:
Header Footer
CLI:
Usage: htmlbilder somedir [-o page.html -t main.hbs -e .html -w]
A tool for converting a directory of Handlebars templates into one HTML file.
Options:
-r, --rootDir [value] Templates directory path. Ignored if
hyphenless arg is provided. (default: "./")
-o, --outFile [value] The output file. (default: "./index.html")
-t, --tempFile [value] Filename pattern for the template files.
(default: "index.hbs")
-e, --dataFileExt [value] The file extension that should be considered
as a data file. (default: ".htm")
-i, --indentChar [value] Indent character for indenting the output HTML
file. options: tab|space (default: "tab")
-c, --indentCharCount [value] How many indentChar? maximum value: 8
(default: 1)
-w, --watch Watch for changes and recreate the output file
on changes.
-v, --version Show version number.
-h, --help Show help.
More examples:
A directory containing a template:
somedir/├─ index.hbs├─ sidebar.htm└─ header/ ├─ index.hbs ├─ user.htm └─ nav.htm
<!-- somedir/index.hbs --> {{{ header }}} {{{ sidebar }}} <!-- somedir/sidebar.htm --> <!-- somedir/header/index.hbs --> {{{ nav }}} {{{ user }}}<!-- somedir/header/user.htm --> <!-- somedir/header/nav.htm -->
index.html
after running htmlbilder somedir
:
A directory not containing a template:
When a directory does not contain a template, all the data files inside it (if there's any) or inside any subsequent folders will be concatenated.
somedir/
├─ index.hbs
├─ sidebar.htm
└─ modals/
├─ confirm.htm
├─ alert.htm
└─ prompts/
├─ age.htm
└─ job.htm
<!-- somedir/index.hbs: --> {{{ sidebar }}} {{{ modals }}} <!-- somedir/sidebar.htm --> <!-- somedir/modals/confirm.htm --> confirm<!-- somedir/modals/alert.htm --> alert<!-- somedir/modals/prompts/age.htm --> prompt age<!-- somedir/modals/prompts/job.htm --> prompt job
index.html
after running htmlbilder somedir
:
confirm alert prompt age prompt job