EmberJS - register precompiled handlebars template

6
votes

For my EmberJS app, I precompile all of my handlebars templates, so they are being loaded as straight Javascript files.

The problem is that these precompiled templates are not making their way into the Ember container like I thought that they would - I get the following error when I specify a template for my view.

Uncaught Error: assertion failed: You specified the templateName "application" for <MyApp.ApplicationView:ember164>, but it did not exist.

Here is my view code.

window.MyApp.ApplicationView = Ember.View.extend({
   templateName: 'application'
});

I stepped through the execution and saw that the views do not exist in the Ember container. Is there something special I need to do to register precompiled templates with the container? If so, how?

Edit: I've been compiling the templates with the handlebars npm package.

3
javascriptember.jshandlebars.js
What are you using to precompile your templates? - mavilein
And, are you injecting the templates before your app loads? Here's a fiddle that shows where you should pre-load. - MilkyWayJoe
I've just been using the npm handlebars package. Is there a special ember one I need to use?? - Jarrod Nettles

3 Answers

3
votes

Templates are looked up on Ember.TEMPLATES (which is just a hash with the template name as the key)

So when your example ApplicationView is executed it will look for the template in Ember.TEMPLATES['application']

1
votes

While the npm handlebars compiler does indeed compile them correctly, you still need to register them with Ember in order for them to load correctly. You can do one of the following:

  • Manually load them with Ember.TEMPLATES['sometemplate'] = COMPILED TEMPLATE. This works but becomes something of a pain.
  • Use a special compiler like npm ember-precompile, which will compile them in such a way that the compiled templates are automatically registered in the Ember template container.
0
votes

If you prefer a Ruby/Guard-based solution, check out my gist here: https://gist.github.com/perlun/5286391

Use it like this from your Guardfile:

guard 'ember_handlebars',
    :input => 'app/handlebars_templates',
    :output => 'app/handlebars_compiled',
    :remove_prefix => 'app/handlebars_templates/' do
  watch(%r{app/handlebars_templates/(.+\.handlebars)})
end

```