Question

我正在开发一个Ember.js项目，并希望利用Slick Carousel库。我已经通过Bower在我的项目文件夹中安装了库，并且很难将其导入我的项目中。

在我的ember-cli-build.js中，我添加了如下的import语句：

app.import('bower_components/slick-carousel/slick/slick.css');
app.import('bower_components/slick-carousel/slick/slick-theme.css');
app.import('bower_components/slick-carousel/slick/slick.js');

我遇到的问题是，当我进行构建（字体，资源等）时，剩余的所需资产不会构建并包含在dist文件夹中，导致错误的字体和资产丢失存在于“bower_components / slick-carousel”文件夹中，但不存在于我的实际Ember应用程序的构建中。

编辑：看起来像Broccoli-Funnel就是我需要的东西。通过从'bower_components'文件夹中指定源文件并将相对路径指向ember-cli-build.js文件中的'dist'文件夹，解决了该问题。

作为注释：在其他地方通常引用的'broccoli-static-compiler'插件已弃用，并使用'broccoli-funnel'作为推荐的插件。

Answer 1

Broccoli-funnel最终成为我想要的。通过将以下内容放在ember-cli-build.js中，所需的文件将在构建期间放在正确的目录中：

var Funnel = require('broccoli-funnel');
var requiredAssets = new Funnel('bower_components/slick-carousel/slick/fonts', {
      srcDir: '/',
      include: ['**/*.*'],
      destDir: '/assets/fonts'
});
return app.toTree([requiredAssets]);

使用Ember CLI从外部库导入所有资产的正确方法

1 个答案: