Make broccoli compile your emblem templates so they’re ready for your ember app.
Broccoli builds your assets quickly. It makes heavy use of caching so it only has to rebuild affected subtrees when files change. Emblem is a significant whitespace version of Handlebars templates, similar in style to Slim or Jade. Ember is a MVC framework for building browser apps.
Put them all together, and you have something that will help you compile your templates quickly for your browser app. The broccoli-ember-emblem plugin for Broccoli will do just that.
To use the library, you’ll need broccoli installed first. Then, you’ll install the plugin via npm:
You’ll setup the plugin in your app’s
Brocfile.js. That setup might look something like this:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19
Note a few things:
- I’m using another plugin,
broccoli-static-compilerto move files around in the broccoli build directories. This is to be able to identify separate trees that both use similar file filters (eg, *.js for both src scripts and templates).
- I’m using the one option for the
stripPathFromName, which allows me to remove the path name from the template name in output. For example, if I have a file at
tmpl/application.emblem, I want the template name in ember to be
- Final output is merged into a single tree via another plugin,
Broccoli will take care of finding all of your template files. It will use directories and filenames as the input for template names. As a few examples, here is input and output as it might happen in the above configuration:
Notice that Ember requires all templates to be registered on the
Ember.TEMPLATES object. Later, at app runtime, they are looked up on that object by name.
So, use the plugin and win. How does your template compilation for Ember/Emblem differ? What other features do you wish were supported here?