Easy way to precompile Emberjs Handlebar templates with nodejs?
I'm enjoying emberjs a lot and would like to take the next step in a couple of my small, mobile apps and precompile my Ember/Handlebars Templates as part of my build process.
I'd prefer to stay away from messing with Ruby and would like to use node.js as I'm more comfortable with using it.
I believe what I want to use is Ember.Handlebars.precompile, but unfortunately I'm unable to load the canonical ember.js file in a node environment. Example of a naive attempt from the node repl:
> var e = require('./ember'); ReferenceError: window is not defined at /Users/jeremyosborne/git/projects/ldls/client/lib/emberjs/src/ember.js:5:1 at Object. (/Users/jeremyosborne/git/projects/ldls/client/lib/emberjs/src/ember.js:1596:2) --- stack trace, you get the idea ---
I think I've already figured out how to set them up in my code so that they work correctly with my views, I just want to compile them in an environment outside of a browser DOM.
In lieu of getting the canonical ember.js to load in node, are there a specific set of files that I can pluck from the ember repo and use to compile my templates?
I did a kluge fix that works great but gets an F for maintainability. I grabbed all the
Handlebars code minus the reference to the
window object. Then I followed with the
Ember.Handlebars.Compiler code, replacing
Object.create, exporting my
Ember object, and viola things work seemingly great in node (as in it works and the functions produced are templates). But I don't consider this an answer to my own question due to the aforementioned maintainafail, so still open for answers.
The above turns out to be a total fail. Perhaps there's something wrong in the procedure, but using
Ember.Handlebars.compile doesn't work. The templates get made, but when I use the precompiled templates attached to Ember.TEMPLATES in my code, they do not work. I only seem to be able to get templates to work when they are explicitly passed in the modified script tags, as suggested on the emberjs.com site.
EDIT 3 I figured out what I was doing wrong. My answer is below.
Found a good enough solution to my problem that seems easy enough to maintain that I'll consider my problem solved.
Here's how I solved things:
- Grab the minimal amount of code I need to precompile the ember templates.
- Copy the contents of the ember handlebars into a file. This file is located at the emberjs repo: https://github.com/emberjs/ember.js/blob/master/packages/handlebars/lib/main.js
- Within the code, find the one instance of
window.Handlebars = Handlebars;and remove it.
- Append the contents of the Ember template compiler and handlebar overrides. The file is located at the emberjs repo: https://github.com/emberjs/ember.js/blob/master/packages/ember-handlebars/lib/ext.js
- Find all instances of
Ember.createand change to
- Outline of the simple precompile procedure:
- Load up the code with a
var Ember = require('./my_ember_precompiler').Ember.
- Get your templates as strings and compile them with
var templateString = Ember.Handlebars.precompile(str).toString().
- This will be different from app to app, but Ember seems to require registration of precompiled templates. After loading, for every created template, we need to register our templates. Basically wrap templateString in a call to
Handlebars.template()and make sure this wrapped function is added to the
- Load up the code with a
The above is painless when it's automated in a script.