Ember-CLI:有没有办法将(供应商)目录复制到/ public/assets？

Question

在Ember-CLI项目中,如果我将包含webfonts及其CSS样式表的public/assets目录添加到目录中,我可以使用它们@import 'assets/font/regular/stylesheet.css.这很好用.

理想情况下,我想将这些资产保留在我的git存储库中,而不是bower install它们作为客户端依赖项,但是如何在Ember-CLI构建中使用这些资产？

说明文档中提到app.import(FILE)的Brocfile.js,这适用于CSS样式表,而不是一个WOFF字体文件:

$ ember build
version: 0.0.28
Build failed.
Error: Path or pattern "nicefont.woff" did not match any files
at Object.multiGlob (/(PATH)/node_modules/ember-cli/node_modules/broccoli-static-compiler/node_modules/broccoli-kitchen-sink-helpers/index.js:216:13)
at /(PATH)/demo/node_modules/ember-cli/node_modules/broccoli-static-compiler/index.js:25:27
at invokeCallback (/(PATH)/node_modules/ember-cli/node_modules/rsvp/dist/commonjs/rsvp/promise.js:228:21)
at publish (/(PATH)/node_modules/ember-cli/node_modules/rsvp/dist/commonjs/rsvp/promise.js:176:9)
at publishFulfillment (/(PATH)/node_modules/ember-cli/node_modules/rsvp/dist/commonjs/rsvp/promise.js:312:5)
at flush (/(PATH)/node_modules/ember-cli/node_modules/rsvp/dist/commonjs/rsvp/asap.js:41:9)

另外,我想指定一个app.import()拒绝的目录.

是否有Ember-CLI/Brocolli这样做？

Answer 1

我以为我被困在这个问题上了,但显然是喝了一杯茶并且在StackOverflow上明确地表达了这个问题,这让我朝着正确的方向前进......

如果您使用bower安装客户端依赖关系,那么在Ember-CLI项目中,这些将最终进入vendor/.要使用(部分)它们而不更改它们,我们可以使用Broccoli稍微笨拙的命名broccoli-static-compiler.首先,安装两个构建时依赖项:

npm install --save-dev broccoli-static-compiler
npm install --save-dev broccoli-merge-trees

在导入Brocfile.js下方的顶部添加EmberApp:

var mergeTrees = require('broccoli-merge-trees');
var pickFiles = require('broccoli-static-compiler');

并在底部Brocfile.js:

// Remove this line:
// module.exports = app.toTree()

// Copy only the relevant files:
var fontOpenSans = pickFiles('vendor/font-opensans', {
   srcDir: '/',
   files: ['**/*.woff', '**/stylesheet.css'],
   destDir: '/assets/fonts'
});

// Merge the app tree and our new font assets.
module.exports = mergeTrees([app.toTree(), fontOpenSans]);

这里我们的客户端依赖是a font-opensans,它指的是包含Open Sans webfont副本的本地git存储库.

就这些!要使用网络字体,链接到assets/的index.html:

<link rel="stylesheet" href="assets/fonts/opensans_regular/stylesheet.css">

这是用ember-cli 0.0.40和一些早期版本测试的.

Answer 2

支持的答案有点过时了.在撰写Ember CLI 0.2.2时,支持在assets目录中直接复制/指纹所需的供应商文件夹.

// Brocfile.js
var app = new EmberApp();
...
var extraAssets = new Funnel('bower_components/a-lovely-webfont', {
  srcDir: '/',
  include: ['**/*.woff', '**/stylesheet.css'],
  destDir: '/assets/fonts'
});

module.exports = app.toTree(extraAssets);

文档在这里