What is ember-cli-htmlbars?
The ember-cli-htmlbars package is an Ember CLI addon that provides a precompiler for Handlebars templates. It allows you to write Handlebars templates in your Ember.js applications and have them compiled into JavaScript functions that can be rendered efficiently.
What are ember-cli-htmlbars's main functionalities?
Precompiling Handlebars Templates
This feature allows you to precompile Handlebars templates into JavaScript functions. The `hbs` tagged template literal is used to define a Handlebars template, which is then compiled by ember-cli-htmlbars.
import { hbs } from 'ember-cli-htmlbars';
export default hbs`<div>{{yield}}</div>`;
Integration with Ember CLI
The package integrates seamlessly with Ember CLI, allowing you to easily add it to your Ember.js project using the Ember CLI command line tool.
ember install ember-cli-htmlbars
Template Compilation
This feature provides a function to compile Handlebars templates into JavaScript functions programmatically. The `compileTemplate` function takes a Handlebars template string and returns a compiled template function.
import { compileTemplate } from 'ember-cli-htmlbars';
const template = compileTemplate('<div>{{yield}}</div>');
Other packages similar to ember-cli-htmlbars
handlebars
The handlebars package is the core Handlebars library that provides the functionality to compile and render Handlebars templates. While it is not specific to Ember.js, it can be used in any JavaScript project to work with Handlebars templates.
ember-handlebars
The ember-handlebars package is an older package that was used in earlier versions of Ember.js to provide Handlebars template compilation. It has largely been replaced by ember-cli-htmlbars in modern Ember.js applications.
Ember CLI HTMLBars
![Build Status](https://travis-ci.org/ember-cli/ember-cli-htmlbars.svg?branch=master)
Handlebars 2.0 Support
Handlebars 2.0 support has been removed. If you are using ember-cli-htmlbars with a 1.9.x project please continue
to use ember-cli-htmlbars@0.6.x.
Using as a Broccoli Plugin
var HtmlbarsCompiler = require('ember-cli-htmlbars');
var templateTree = new HtmlbarsCompiler('app/templates', {
isHTMLBars: true,
templateCompiler: require('./bower_components/ember/ember-template-compiler')
});
Registering a Plugin
var SomeTransform = require('./some-path/transform');
module.exports = {
name: 'my-addon-name',
included: function() {
this.app.registry.add('htmlbars-ast-plugin', {
name: 'some-transform',
plugin: SomeTransform
});
}
};
Precompile HTMLBars template strings within other addons
module.exports = {
name: 'my-addon-name',
setupPreprocessorRegistry: function(type, registry) {
var htmlbarsPlugin = registry.load('template').find(function(plugin) {
return plugin.name === 'ember-cli-htmlbars';
});
var precompiled = htmlbarsPlugin.precompile("{{my-component}}");
}
};