Ember.js 使用Ember CLI和Brocoli compass添加供应商CSS库

在使用插件时，将CSS库添加到Ember CLI项目时遇到问题

我已将这一行添加到我的文档中：

app.styles = function() {
  return compileCompass(this.appAndDependencies(), this.name + '/styles/app.scss', {
    outputStyle: 'expanded',
    sassDir: this.name + '/styles',
    imagesDir: 'public/images',
    cssDir: '/assets',
    importPath: 'vendor'
  });
};

但现在我被卡住了。我试过了

app.import('vendor/bootstrap/docs/assets/css/bootstrap.css');

但这不起作用，因为（我想）我已经覆盖了

app.style

---

我已经尝试将

导入路径添加到Compass配置中，这样我就可以在我的SASS文件中
@import
，但这也不起作用。
上面的
app.style=…
行似乎覆盖了一些余烬CLI代码，因此from-Ember CLI指南不起作用

在花了一段时间吃西兰花之后，我想出了如何为
供应商提供
文件夹：

var pickFiles = require('broccoli-static-compiler');
var vendor = pickFiles('vendor', {srcDir: '/', destDir: '/vendor'});

现在
西兰花服务
服务于我的供应商文件夹中的所有内容，并且

@import 'vendor/bootstrap/docs/assets/css/bootstrap.css';

在我的
app.scss
文件中工作

当然，我需要做更多的工作，以便最终构建中只包含供应商资产的分发版本。
版本0.0.5解决了这个问题，以下是对我有效的方法：

var compileCompass = require('broccoli-compass');
app.styles = function() {
  return compileCompass(this.appAndDependencies(), this.name + '/styles/app.scss', {
    outputStyle: 'expanded',
    sassDir: this.name + '/styles',
    imagesDir: 'public/images',
    cssDir: '/assets',
    importPath: [
      process.cwd() + '/vendor/foundation/scss'
    ],
  });
};

现在我可以在我的scss文件中执行导入基础。
您可以在addon.scss中添加一个供应商文件，在addon的index.js中添加一个treeForAddon钩子，在编译之前将供应商目录与漏斗合并

treeForAddon: function(tree) {
    this._requireBuildPackages();

    if (!tree) {
      return tree;
    }

    var addonTree = this.compileAddon(tree);

    var vendorCss = new Funnel(this._treeFor('vendor'), {
      srcDir: '/css'
    });

    var mergedStylesTree = new MergeTrees([this._treeFor('addon-styles'), vendorCss]);

    var stylesTree = this.compileStyles(mergedStylesTree);

    return MergeTrees([addonTree, stylesTree].filter(Boolean));
  }

你把Compass的config.rb文件放在哪里了？我不断得到“您必须从项目目录编译单个样式表”。我的样式位于
/app/styles
下，我将config.rb放在
/app
中，但这似乎不起作用。我没有config.rb，只使用.scss文件和Compass库（例如@include border-radius（））@sam selikoff：这与我从SCSS文件导入图像时面临的问题非常相似。如果可以，请你看看我的问题：。。。或者发布一个链接到您的完整
Brocfile.js
导入工作在哪里？谢谢，您可以发布它，包括
app.style
中的位吗。。。罗盘钻头是我最麻烦的部分。山姆，谢谢你。我试着做你做过的事情，而供应商的CSS位就像一个符咒。然而，我没有太多的运气与精灵生成的图像。我已经开始悬赏我的问题（链接在第一条评论中）。我看到你自己也为西兰花指南针做出了贡献——如果你能尝试一下，我将不胜感激。