Javascript 如何使用live reload向ember cli应用程序添加花椰菜插件？

当我运行

ember build

时，花椰菜插件运行正常， 并将sprite CSS文件和sprite PNG文件输出到assets目录中

当我运行

ember-service

时，最初也会发生同样的事情。 但是，当我保存任何文件时，导致西兰花重建其树， sprite CSS和PNG文件不再合并到主应用程序树中， 当页面从live reload刷新时，页面不再显示精灵图像

• 为什么会发生这种情况
• 如何确保每次都合并插件的输出

---

详细信息：

问了之后,， 尽管有人悬赏却没有得到回应， 我决定为CSS图像精灵生成编写自己的花椰菜插件：

我到目前为止所做的尝试：

#一,

我正在使用

Brocfile.js中的这个插件将插件的输出与主应用程序的输出合并起来

    var app = new EmberApp(/* ... */);
    /* other ember-cli init for app */
    var broccoliSprite = require('broccoli-sprite');
    var spritesTree = broccoliSprite(/* ... */);
    var appTree = app.toTree();
    var broccoliMergeTrees = require('broccoli-merge-trees');
    module.exports = broccoliMergeTrees([spritesTree, appTree]);

我知道这可能不是一个好办法，而且我对ember cli和西兰花都是相当陌生的，所以如果这是一个新手错误，请原谅

#二,

在
Brocfile.js
中，扩展
EmberApp
以包含
精灵的新树：

var EmberApp = require('ember-cli/lib/broccoli/ember-app');
var broccoliSprite = require('broccoli-sprite');

EmberApp.prototype.sprites = function() {
  console.log('EmberApp.prototype.sprites');
  var spritesTree = broccoliSprite('public', this.options.sprite);
  return spritesTree;
};
var originalEmberAppToArray = EmberApp.prototype.toArray;
EmberApp.prototype.toArray = function() {
  var sourceTrees = originalEmberAppToArray.apply(this, arguments);
  sourceTrees.push(this.sprites());
  return sourceTrees;
};

Ember CLI的下一个版本将对附加组件提供一流的支持。感谢罗伯特·杰克逊

看一看，了解如何包装Ember CLI的西兰花雪碧

我期待在未来的应用程序中使用它：）
谢谢你指出这一点，Jamie，它应该会派上用场。你会知道为什么插件的第二次和后续运行与第一次运行的行为不同吗？我不是专家，但我猜它可能运行在子树上？+1，然后检查-结果非常好！刚刚发布了v0.0.3版，其中包含修复程序。仍然只是一个花椰菜插件，还不是ember cli注册表插件-我将等待ember cli@>0.0.34首先发布，以便我可以测试它