Templating language targeting Handlebars with default Ember.js conventions
Want to see pretty graphs? Log in now!
npm install emblem
|9||downloads in the last day|
|167||downloads in the last week|
|407||downloads in the last month|
|Last Published By|
|Version||0.3.15 last updated 3 days ago|
|Keywords||ember, handlebars, template, html, indentation|
|Dependencies||handlebars, optimist, uglify-js, StringScanner|
|Dependents (6)||broccoli-ember-emblem, broccoli-emblem-compiler, connect-assets-emblem, gulp-ember-emblem, gulp-emblem, mimosa-emblem|
Emblem.js is an indentation-based templating language that compiles down to the Handlebars.js runtime. It is therefore:
- Efficiently/easily precompilable
- Compilable in the browser
- Fully compatible with Ember.js's auto-updating templates (with Ember-targeting/friendly syntax)
Also check out the Embercast on Emblem.js
Handlebars Version Dependencies
Updated: July 2013
In the push to Handlebars 1.0.0, some changes were made to the Handlebars internals that broke Emblem, but Emblem's been fixed as of July 1, 2013. Here are the versions you should be using:
- Handlebars 1.0.0: Use Emblem >= 0.3.0
- Handlebars <= 1.0.0.rc4: Use Emblem <= 0.2.9
Updated: March 2014
Handlebars >= 1.3.0 is required to use query params.
Emblem uses the following syntax:
= link-to 'index' (query-params foo="wat")
- Read the syntax documentation.
- Watch the Embercast
- Check out this JSBin.
- Check out this demo of an ember-rails site with Emblem enabled.
Using Emblem in your application
You can use Emblem to compile either to vanilla Handlebars or Emberized Handlebars. Let's assume you're compiling to Emberized Handlebars for use with an Ember app.
Compiling in the Browser
Follow the pattern in this JSBin:
- Include Handlebars
- Include Emblem
- Include Ember
If you have a recent enough version of Ember, all the Emblem code you
<script type="text/x-emblem"> tags will get compiled and
stripped out of the DOM. If you're using an out-of-date Ember, you
can trigger this to happen manually before app initialization via
Via Rails 3.1+
Add the following to your Gemfile:
emblem-rails presently depends on
ember-rails. With these
two gems, any templates ending in
.emblem will be (pre)compiled
Also, check out the demo app which uses the above configuration.
Updates to Emblem syntax do not require an update to
update to the latest Emblem, you can run:
bundle update emblem-source
All Emblem Plugins
- barber-emblem, a
Precompilation library for Ruby (used in
- emblem-brunch, Emblem support for Brunch.io
- Mimosa (support for Emblem since v 0.10.1)
- grunt-emblem, Emblem support for Grunt (and Yeoman)
- gulp-emblem, Emblem support for gulp
Clone the repo, then run:
npm install grunt
This will also automatically run the test suite.
Check out vim-emblem for Vim editor support for Emblem.
Otherwise, for now, please refer to syntax highlighting solutions for Slim, which is not much different from Ember's. At some point, we'll have something even more custom tailored to Emblem (feel free to take a swing at it and send in a PR).
If you find a bug in Emblem syntax, please try to reproduce it in its simplest form with this JSBin before reporting an issue, which will help me nail down the source of the issue.