Not having to namespace addon assets in LESS files

[notmessenger]

conorlinehan [12:04 PM] I’m moving our images font and styles to an addon we used for shared stuff. The problem is we will have to change our urls from /assets/images to /shared-addon/assets/images in our .scss files. I’d like to not have to go in and change the urls since the files are shared with a rails app. Is there anyway to just prepend the addon name on to the urls on completion or will it have to be done manually? :simple_smile:

rk [12:42 PM] @conorlinehan: i have just the trick for your needs, i'll look it up for in minute.

conorlinehan [12:43 PM] Thanks a million @rk :smile:

rk [12:48 PM] @conorlinehan: https://gist.github.com/raido/87a461b896f9281ed574

​[12:48] So in your addon’s index.js just implement treeForPublic hook.

conorlinehan [12:49 PM] Brilliant won’t have to touch styles at all thank you :smile:

rk [12:52 PM] Exactly, i am doing app branding this way. Like default branding of the app has one set of images and then branding addon has another, this gives power to simply do “ember install my-branding-addon” and my app changes looks.

Of course other assets that are shareable and should not have namespace.

/* jshint node: true */
'use strict';

var Funnel        = require('broccoli-funnel');
var mergeTrees    = require('broccoli-merge-trees');

module.exports = {
  name: '<your addon>',

  /**
   * Override default implementation for treeForPublic, because we want non namespaced assets
   *
   * @see https://github.com/ember-cli/ember-cli/blob/master/ADDON_HOOKS.md#treefor-cont
   */

  treeForPublic: function(tree) {
    var assetsTree = new Funnel('public');
    return mergeTrees([tree, assetsTree], {
      overwrite: true
    });
  }
};