Find file
Fetching contributors…
Cannot retrieve contributors at this time
95 lines (55 sloc) 3.28 KB

Use handlebars.js templates with the asset pipeline


Are your handlebars.js templates littering your Rails views with script tags? Wondering why the nifty Rails 3.1 asset pipeline streamlines all your Javascript except for your Handlebars templates? Wouldn't it be nice to have your Handlebars templates compiled, compressed, and cached like your other Javascript?

Yea, I think so too. That is why I wrote handlebars_assets. Give your Handlebars templates their own files (including partials) and have them compiled, compressed, and cached as part of the Rails 3.1 asset pipeline!


Load handlebars_assets and execjs in your Gemfile

gem 'handlebars_assets'
gem 'execjs'

Require handlebars.vm.js in your Javascript manifest (i.e. application.js)

//= require handlebars.vm

If you need to compile your Javascript templates in the browser as well, you should instead require handlebars.js (which is significantly larger)

//= require handlebars

Compiling your Javascript templates in the asset pipeline

Templates directory

You should located your templates under app/assets/templates. In your Javascript manifest file, use require_tree

//= require_tree ../templates

The template file

Write your Handlebars templates as standalone files in your templates directory. Organize the templates similarly to Rails views.

For example, if you have new, edit, and show templates for a Contact model


Your file extensions tell the asset pipeline how to process the file. Use .hbs to compile the template with Handlebars. Combine it with .jst to add the compiled template to the JST global variable.

If your file is templates/contacts/new.jst.hbs, the asset pipeline will generate Javascript code

  1. Compile the Handlebars template to Javascript code
  2. Add the template code to the JST global under the name contacts/new

You can then invoke the resulting template in your application's Javascript



If you begin the name of the template with an underscore, it will be recognized as a partial. You can invoke partials inside a template using the Handlebars partial syntax:

Invoke a {{> partial }}

Important! Handlebars does not understand nested partials and neither does this engine. No matter how nested, the partial is named from the asset's basename. The following will lead to much frustration (so don't do it :)



This gem is standing on the shoulders of giants.

Thank you Yehuda Katz (@wycats) for handlebars.js and lots of other code I use every day.

Thank you Charles Lowell (@cowboyd) for therubyracer and handlebars.rb.


Once you've made your great commits

  1. Fork
  2. Create a topic branch - git checkout -b my_branch
  3. Push to your branch - git push origin my_branch
  4. Create a Pull Request from your branch
  5. That's it!


  • Les Hill (@leshill)


  • Matt Burke (@spraints) : execjs support
  •        (@kendagriff) : 1.8.7 compatibility