Question

我有一个使用Ember-Cli的小型EmberJS应用程序。我的应用程序有一个私人ES6库，它是一个bower依赖。基本上，我想要的是导入库并在任何我想要的地方使用它。

如果我没有错，我应该在我的brocfile.js中翻译图书馆并在之后使用它。不幸的是，我无法提供太多具体信息，但我会尽力让自己更清楚。

我的外部库名为main-lib，其结构如下（它在另一个项目中工作）：

bower_components
- 主-LIB
  - api.js
  - main.js
  - message.js

在main.js文件中，我有以下内容：

import Api from 'main/api';
import Message from 'main/message';

var main = {};

main.api = Api;
main.message = Message;

export default main;

所以，我想要做的是，在我的应用程序中，导入main并使用它包含的不同功能。

示例，在某个emberjs控制器中：

import Main from 'main';

//use Main here

为此，我想在brocfile.js中执行以下操作

var tree = 'bower_components/main-lib';
var ES6Modules = require('broccoli-es6modules');
var amdFiles = new ES6Modules(tree, {
  format: 'amd',
  bundleOptions: {
    entry: 'main.js',
    name: 'mainLib'
  }
});

然而，这没有任何作用。基本上，我希望将转换后的文件包含在vendor.js或我可以通过导入它来使用库的地方。

我在这里找不到一些东西，但我无法确定它。

编辑1：在我的brocfile.js末尾添加这些行后：

mergeTrees = require('broccoli-merge-trees')

module.exports = mergeTrees([app.toTree(), amdFiles]);

我可以得到一个如下所示的ES5：

define(['main/api', 'main/message'], function(api, message) {

    var main = {};

    main.api = Api;
    main.message = Message;

    var _main = main;
    return _main;
});

问题是它也不会导入main/api和main/message。我是否必须为我想要的每个文件重复代码？

此外，该文件未在vendor.js中连接，只是在/dist

的根目录下连接

Answer 1

您有以下内容：import Api from 'main/api' - 但我没有在您解释的内容中看到名为main的文件夹 - 只有一个名为main-lib的文件夹...

可能是因为它们实际上不存在而导致main/api和main/message不包括在内吗？您可能需要在main-lib/api文件中使用main-lib/message和main.js

Answer 2

Broccoli与ember-cli的整合已经包含了一个转换器，所以我认为这样的事情应该足够了：

app.import('bower_components/main-lib/main.js', {
  type: 'vendor',
  exports: { 'main': ['default'] }
);

然后你可以：

import Main from 'main';

根据您目前在Brocfile中的内容，您仍然需要合并amdFiles（app.import会为您做到这一点。）

类似的东西：

mergeTrees = require('broccoli-merge-trees')


module.exports = mergeTrees([app.toTree(), amdFiles]);

这些都没有经过测试，但你明白了。

Answer 3

Ember似乎是advocating使用：https://www.npmjs.com/package/broccoli-es6modules

这意味着导入您的模块看起来像：

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

var tree = './bower_components/main-lib';
var ES6Modules = require('broccoli-es6modules');
var amdFiles = new ES6Modules(tree, {
  format: 'amd',
  bundleOptions: {
    entry: 'main.js',
    name: 'main-lib'
  }
});

module.exports = mergeTrees([app.toTree(), amdFiles])

在Ember-cli项目中使用ES6库

3 个答案: