Ember-cli addons and helpers

Question

What is the correct way of placing your helper files and also where should they go with respect to the resolver finding them from an addon ember-cli project?

I am running ember-cli 0.2.2.

I generated an helper from an addon project with:

ember g helper display-helper

The generator placed the file in app/helpers which seemed wrong to me, I would have thought that it should have been placed in addon helpers. I moved the file to addon/helpers and it looks like this:

export default Ember.Handlebars.registerBoundHelper('displayHelper', function displayHelper(searchPath) {
  return new Ember.Handlebars.SafeString(get(this, searchPath));
});

When I ran ember test I get the following output:

✘ Error: Assertion Failed: A helper named 'displayHelper' could not be found

The only way I get this helper to be found by the resolver is to add an import that references the helper in a component that is using it like this:

import displayHelper from '../helpers/display-helper';

This does not seem correct, I would have thought the resolver would have found this automatically?

Also even if I have the reference, the following code ends up with the same error message as above:

import Ember from 'ember';

var get = Ember.get;

function displayHelper(context, searchPath) {
  return new Ember.Handlebars.SafeString(get(context, searchPath));
}

export default Ember.Handlebars.makeBoundHelper(displayHelper);

So to sum up, I have to have this line in the component whose template uses the helper:

import displayHelper from '../helpers/display-helper';

And I have to use registerBoundHelper and not makeBoundHelper like the docs say or the helper cannot be found.

Gaurav Gaurav · Accepted Answer · 2015-04-05T10:52:10

If you move your helper from app/helpers to addon/helpers, it is not available in your app namespace. To fix this, add the following file:

// app/helpers/display-helper.js

import displayHelper from 'your-addon-name/helpers/display-helper";
export default displayHelper;

(Do not copy your-addon-name literally, use the name of your addon, which is also your addon's namespace.)

This is based on the instructions here:

http://www.ember-cli.com/#addon-components

Just like the example component there, you can put your real helper code in addons/helpers/display-helper, but you need to import and reexport it to your app for your resolver to find it.

Ember-cli addons and helpers

1 Answers