grunt-jade-plugin
Compile Jade templates to one JavaScript file (normal or AMD).
Note: This plugin requires Grunt ~0.4.0
. If you're still using grunt v.0.3.x please use 0.3.x branch of this plugin.
Installation
npm install grunt-jade-plugin --save-dev
If you're still using Grunt v.0.3.x:
npm install grunt-jade-plugin@~0.3.0 --save-dev
Then it may be enabled inside your Gruntfile with this line of JavaScript:
grunt;
Config Examples
AMD compilation
jade2js:compile:options:amd: trueamdDependences:'jade': 'jade''underscore': '_'files:'templates.js': 'temlates/user.jade' 'templates/account.jade'
The result templates.js file will content:
You can use your compiled templates like this:
Normal JS file compilation
jade2js:compile:options:namespace: 'MyApp.Templates'files:'templates.js': 'temlates/*.jade'
The result templates.js file will content:
this'MyApp' = this'MyApp' || {};this'MyApp''Templates' = this'MyApp''Templates' || {};// Template functionthis'MyApp''Templates''user' = {};
You can use your compiled templates like this:
var data = name: 'John' age: 28;var htmlResult = MyAppTemplates;
Documentation
object
Files Define what files this task will process. For more info about files object
please read Grunt docs.
Examples:
files: 'templates1.js': 'source/*.jade' // includes files from source dir only 'templates2.js': 'source/**/*.jade' // includes files from source dir and all its subdirs 'templates3.js': 'path/to/sources/file.jade' 'path/to/more/other.jade'
object
Options This controls how this task operates and should contain key:value pairs, see options below.
All options and defaults:
options: amd: false amdDependences: {} includeRuntime: true injectBefore: '' namespace: 'Templates' compileDebug: false filters: { return filename0; }
function
processName This option accepts a function which takes the template filepath and returns a string which will be used as the key for the precompiled template object.
By default processName removes the template file path and an extension like this:
// Before:Templates'templates/user.jade'// After:Templates'user'// So you can access your template function like this:Templatesuser
You can change the default behaviour like this:
files:'templates.js': 'temlates/user.jade' 'templates/account.jade'options:{return filename}
Resutl:
Templates'templates/user.jade'Templates'templates/account.jade'
Object
filters Gruntfile.js:
options:filters:{}{}
boolean
includeRuntime Determine if Jade's runtime.js file will be included into the result JS file. By default it will be included.
Note that you have to use the runtime file anyway. So if you prefer to keep it separately, you can download it from the official repository.
boolean
amd Determine if preprocessed template functions will be wrapped in Require.js define function (default is false
).
;
object
amdDependences amdDependences:'helpers': 'helpers''underscore': '_'
Result:
string
namespace The namespace in which the precompiled templates will be assigned (default is 'Templates'
). Use dot notation (e.g. App.Templates) for nested namespaces.
Example:
options:namespace: 'MyApp.Templates'
Result:
this'MyApp' = this'MyApp' || {};this'MyApp''Templates' = this'MyApp''Templates' || {};// Template functionthis'MyApp''Templates''user' = {};
string
injectBefore It should contain a string that will be injected before precompiled templates.
options:injectBefore: '// string to enject'
Release History
Check the HISTORY.md file for change logs and release notes.
License
Copyright (c) 2012 Ivan Votti
Licensed under the MIT license.
https://github.com/ivanvotti/grunt-jade-plugin/blob/master/LICENSE-MIT