Ember-CLI：有没有办法将（供应商）目录复制到/ public / assets？ [英] Ember-CLI: Is there a way to copy a (vendor) directory to /public/assets?

问题描述

在Ember-CLI项目中，如果我将一个包含webfonts及其CSS样式表的目录添加到 public / assets 目录中，我可以使用它们，例如<$ / code>。这样做很好。

In an Ember-CLI project, if I add a directory containing webfonts and their CSS stylesheets to the public/assets directory, I can use them with something like @import 'assets/font/regular/stylesheet.css. This works fine.

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

Ideally though, I'd like to keep these assets out my git repository, and instead bower install them as client-side dependencies, but how can these assets be used in the Ember-CLI build?

文档提到 app.import （FILE）在 Brocfile.js 中，适用于CSS样式表，但不适用于WOFF字体文件：

The documentation mentions app.import(FILE) in Brocfile.js, which works for CSS stylesheets, but not for a WOFF font file:

$ 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（）拒绝。

Also, I would like to specify a directory, which is app.import() refuses.

有没有Ember-CLI / Brocolli这样做？

Is there an Ember-CLI / Brocolli way of doing this?

推荐答案

我以为我被困在这个问题上，但显然是一杯茶，并明确表达了StackOverflow的问题推动了我正确的方向...

I thought I was stuck on this issue, but apparently a cup of tea and explicitly phrasing the question on StackOverflow pushed me in the right direction…

如果您安装客户端依赖关系然后在Ember-CLI项目中，这些将以供应商/ 结束。要使用（部分）它们而不改变它们，我们可以使用西兰花稍微尴尬的西兰花静态编译器。首先，安装两个构建时间依赖关系：

If you install a client-side dependency with bower, then in an Ember-CLI project these will end up in vendor/. To use (parts of) them without changing them, we can use Broccoli's slightly awkwardly named broccoli-static-compiler. First, install two build-time dependencies:

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

在 Brocfile.js 添加在 EmberApp import

In Brocfile.js add at the top below the EmberApp import:

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]);

这里我们的客户端依赖关系是一个 font-opensans ，它是指包含Open Sans webfont的副本的本地git仓库。

Here our client-side dependency is a font-opensans, which refers to a local git repository containing a copy of the Open Sans webfont.

这就是全部！要使用网络字体，请从 index.html 链接到 assets / ：

That is all! To use the web-font, link to assets/ from index.html:

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

这是使用 ember-cli 0.0.40 和几个版本。

这篇关于Ember-CLI：有没有办法将（供应商）目录复制到/ public / assets？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！