grunt-contrib-jst

Compile underscore templates to JST file.

Getting Started

Install this grunt plugin next to your project's grunt.js gruntfile with: npm install grunt-contrib-jst

Then add this line to your project's grunt.js gruntfile:

grunt.loadNpmTasks('grunt-contrib-jst');

Overview

This task compiles Underscore compatible templates into functions that can be concatenated and minified with existing source files.

Inside your grunt.js file, add a section named jst. This section specifies the files to compile and the options passed to underscore.template.

Parameters

files object

This defines what files this task will process and should contain key:value pairs.

The key (destination) should be an unique filepath (supports grunt.template) and the value (source) should be a filepath or an array of filepaths (supports minimatch).

Note: Values are precompiled to the namespaced JST array in the order passed.

options object

This controls how this task (and its helpers) operate and should contain key:value pairs, see options below.

Options

namespace string

The namespace in which the precompiled templates will be asssigned (default is JST). Use dot notation (e.g. App.Templates) for nested namespaces.

Example:

options: {
  namespace: 'JST'
}

prettify boolean

When doing a quick once-over of your compiled template file, it's nice to see an easy-to-read format that has one line per template. This will accomplish that.

Example:

options: {
  prettify: true
}

amdWrapper boolean

With Require.js and a pre-compiled template.js you want the templates to be wrapped in a define. This will wrap the output in:

define(function() {
  //Templates
  return this["NAMESPACE"];
});

Example:

options: {
  amdWrapper: true
}

processName function

This option accepts a function which takes one argument (the template filepath) and returns a string which will be used as the key for the precompiled template object. The example below stores all templates on the default JST namespace in capital letters.

options: {
  processName: function(filename) {
    return filename.toUpperCase();
  }
}

templateSettings object

The settings passed to underscore when compiling templates.

Config Examples

jst: {
  compile: {
    options: {
      templateSettings: {
        interpolate : /\{\{(.+?)\}\}/g
      }
    },
    files: {
      "path/to/compiled/templates.js": ["path/to/source/**/*.html"]
    }
  }
}

--

Task submitted by Tim Branyen.