How can I inline a Component's layout in an AddOn?


I’m creating a library of components that will have very simple layouts. For example:

export default Ember.Component.extend({
  layout: Ember.HTMLBars.compile('{{}}')

The problem is, this will fail with the error:

Cannot call `compile` without the template compiler loaded. Please load `ember-template-compiler.js` prior to calling `compile`.

unless I import the template compiler in ember-cli-build.js of the consuming application:

app.import(app.bowerDirectory + '/ember/ember-template-compiler.js');

Is there anyway I can import the template compiler in the AddOn so that I don’t add this dependency in the consuming application?



Sounds like a very bad idea. The template compiler is almost 700kB, that’s probably 10 times the size of your addon.
Why don’t you just compile your addon’s templates in your build process?


Why don’t you just compile your addon’s templates in your build process?

sounds like a good idea. I’m not quite there yet, however. I’m still developing the addon and using npm link to pull it into the test project. So, I guess I can import the compiler into the test project and then make sure the templates get built when I’m ready to release the addon.



Why not just use the htmlbars-inline-compiler? It comes standard in newly generated addon, but I think you need to move it from devDependencies to dependencies


Yup, this is exactly what I needed:

import Ember from 'ember';
import hbs from 'htmlbars-inline-precompile';

let TableDataComponent = Ember.Component.extend(
    tagName: 'td',
    layout: hbs('{{get row propertyName}}')

export default TableDataComponent;