⚠️ Archived ⚠️
This library has been superceded by babel-plugin-ember-template-compilation and ember-template-imports.
Depending on a consumer's ember-source version, ember-cli-htmlbars will select whether to use babel-plugin-htmlbars-inline-precompile
or babel-plugin-ember-template-compilation
- based on this code -- i.e: after ember-source@3.27.0-alahpa.1
, only babel-plugin-ember-template-compilation
will be used.
At the time of archiving this repo, ember-source@3.x
is not under LTS
babel-plugin-htmlbars-inline-precompile
Babel plugin to replace tagged .hbs
formatted strings with a precompiled version.
Requirements
- Node 8+
- Ember 2.10+
- Babel 7
Usage
Can be used as either a normal function invocation or a tagged template string:
import hbs from 'htmlbars-inline-precompile';
hbs`some {{handlebarsthingy}}`;
hbs('some {{handlebarsthingy}}');
When used as a normal function invocation, you can pass additional options (e.g. to configure the resulting template's moduleName
metadata):
import hbs from 'htmlbars-inline-precompile';
hbs('some {{handlebarsthingy}}', { moduleName: 'some/path/to/file.hbs' });
Babel Plugin Usage
var HTMLBarsCompiler = require('./bower_components/ember/ember-template-compiler');
var HTMLBarsInlinePrecompile = require('babel-plugin-htmlbars-inline-precompile');
require('babel').transform("code", {
plugins: [
[HTMLBarsInlinePrecompile, {precompile: HTMLBarsCompiler.precompile}],
],
});
Example
import { module, test } from 'qunit';
import { setupRenderingTest } from 'ember-qunit';
import { render } from '@ember/test-helpers';
import hbs from 'htmlbars-inline-precompile';
module("my component", function(hooks) {
setupRenderingTest(hooks);
test('inline templates ftw', async function(assert) {
await render(hbs`hello!`);
assert.dom().hasText('hello!');
});
});
results in
import { module, test } from 'qunit';
import { setupRenderingTest } from 'ember-qunit';
import { render } from '@ember/test-helpers';
import hbs from 'htmlbars-inline-precompile';
module("my component", function(hooks) {
setupRenderingTest(hooks);
test('inline templates ftw', async function(assert) {
await render(Ember.HTMLBars.template(function() {
/* crazy HTMLBars template function stuff */
}));
assert.dom().hasText('hello!');
});
});