Small set of plugins for RequireJS that deal with templating engines such as Handlebars or Mustache.
For more plugins please check the RequireJS wiki.
You can use bower to install this set of plugins:
$ bower install --save requirejs-template-plugins
To use Underscore templates in your app, your configuration should look like this:
require.config({
paths: {
underscore: 'bower_components/requirejs-template-plugins/lib/underscore',
},
map: {
'*': {
jst: 'bower_components/requirejs-template-plugins/jst'
}
}
});
Then you would load the template in your view like this:
define(function (require) {
var Backbone = require('backbone');
var template = require('jst!views/button');
return Backbone.View.extend({
template: template,
render: function () {
this.$el.html(template({name: 'Daniel'}));
return this;
}
});
});
Which would try to load views/button.jst
:
Hi <%=name%>!
To use Handlebars templates, your configuration should look like this:
require.config({
paths: {
handlebars: 'bower_components/requirejs-template-plugins/lib/handlebars',
},
map: {
'*': {
hbs: 'bower_components/requirejs-template-plugins/hbs'
}
}
});
Then you would load the template in your view like this:
define(function (require) {
var Backbone = require('backbone');
var template = require('hbs!views/button');
return Backbone.View.extend({
template: template,
render: function () {
this.$el.html(template({name: 'Daniel'}));
return this;
}
});
});
Which would try to load views/button.hbs
:
Hi {{name}}!
To use Mustache templates, your configuration should look like this:
require.config({
paths: {
hogan: 'bower_components/requirejs-template-plugins/lib/hogan',
},
map: {
'*': {
hgn: 'bower_components/requirejs-template-plugins/hgn'
}
}
});
Then you would load the template in your view like this:
define(function (require) {
var Backbone = require('backbone');
var template = require('hgn!views/button');
return Backbone.View.extend({
template: template,
render: function () {
this.$el.html(template({name: 'Daniel'}));
return this;
}
});
});
Which would try to load views/button.mustache
:
Hi {{name}}!
Run the following:
$ grunt test:browser
And open http://localhost:8000/ in your browser.
If you want to rerun tests on file changes, run the following instead:
$ grunt follow:browser
Run the following:
$ grunt test:phantom
If you want to rerun tests on file changes, run the following instead:
$ grunt follow:phantom
- Code:
git clone git://github.com/unindented/requirejs-template-plugins.git
- Home: https://github.com/unindented/requirejs-template-plugins/
Daniel Perez Alvarez (unindented@gmail.com)
Copyright (c) 2014 Daniel Perez Alvarez (unindented.org). This is free software, and may be redistributed under the terms specified in the LICENSE file.