grunt-static-handlebars

Compile your Handlebars templates into static html files.

STATIC-HANDLEBARS

Compile your handlebars templates into static html files.

This plugin requires Grunt ~0.4.1 which uses Node.js.

If you haven't used Grunt before, be sure to check out the Getting Started guide, as it explains how to create a Gruntfile as well as install and use Grunt plugins. Once you're familiar with that process, you may install this plugin with this command:

npm install static-handlebars --save-dev

One the plugin has been installed, it may be enabled inside your Gruntfile with this line of JavaScript:

grunt.loadNpmTasks('static-handlebars');

In your project's Gruntfile, add a section named static_handlebars to the data object passed into grunt.initConfig().

grunt.initConfig({
  static_handlebars: {
    options: {
      // Task-specific options go here. 
    },
    your_target: {
      // Target-specific file lists and/or options go here. 
    },
  },
})

Type: String or Array
Default value: ''
Extension: .hbp

A string or array value that resembles the files to use as Handlebars-partials.

Type: String or Array
Default value: ''
Extension: .js

A string or array value that resembles the files to use as Handlebars-helpers.

grunt.initConfig({
  static_handlebars: {
    options: {
        partials:'',
        helpers:''
    },
    target: {
        // Target-specific file lists and/or options go here. 
        options:{
            json:'',
            partials:[],
            helpers:[]
        },
        files:{}
    },
  },
})

Type: String or Array
Default value: ''
Extension: .json

A string or array value that resembles the files to use as context-input (json).

Type: Array
Default value: options.partials

Use this option to overrule/ignore the global partials variable during this specific target.

Type: Array
Default value: options.helpers

Use this option to overrule/ignore the global helpers variable during this specific target.

Type: Object or Array
Default value: ''
Extension: .hbt or .html

A string or array value that resembles the files to use as Handlebars-templates.

{'destinationFolder/file.html':'inputFolder/input.hbt'}

or

{'destinationFolder/*.html':'inputFolder/*.hbs'}

to render all Handlebars templates.

See the /test directory for examples how to use this. Some remarks:

  • .hbt are Handlebars-templates
  • .hbp are Handlebars-partials
  • Handlebars-helpers are JS functions and therefore saved as .js files.
  • Handlebars-helpers have 1 difference with browser-based versions:
    • js this.Handlebars.compile can be used while js Handlebars.compile is not available due to scoping. (see TODO)
  • .html files can also be referenced as "files" to use in your GruntFile
  • if Handlebars-templates have no markup (like {{) it will copied as plaintext.

In lieu of a formal styleguide, take care to maintain the existing coding style. Add unit tests for any new or changed functionality. Lint and test your code using Grunt.

0.1.0 - Initial release.

  • fix Handlerbars-global, now this.Handlebars is needed inside Handlebars-helpers
  • (?) Handlebars inline declaration
  • (?) option to provide string and no json-file?!
  • (?) cli-option
  • A general json file as default context/data
  • Add "-" to partials, possible? what kind of restrictions exist?