使用Ember CLI和broccoli-compass添加供应商CSS库

Question

使用broccoli-compass插件时,我无法将CSS库添加到我的Ember CLI项目中.

我已将此行添加到我的brocfile中:

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.styles.

我已经尝试添加一个importPath我的Compass配置,以便我可以@import在我的SASS文件中,但这也没有用.

Answer 1

上面的行似乎app.styles = ...覆盖了一些 Ember CLI 代码，因此Ember CLI 指南中的app.import 建议不起作用。

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

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

现在broccoli serve提供我的供应商文件夹中的所有内容，并且

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

在我的文件中工作app.scss。

当然，我需要做更多的工作，以便只有供应商资产的分发版本包含在最终版本中。