如何在 ember-cli 项目中将 JavaScript 文件捆绑在 /vendor 下？

Question

假设我在 /vendor 目录下有一个 ES6 库 "foo" 在 EmberJS 项目中使用最新的 ember-cli 构建（在撰写本文时2.4.3).假设 foo 是一个包含多个文件的库，例如bar.js，baz.js，等等，他们都出口一些东西。

我想将 vendor/foo/bar.js、vendor/foo/baz.js 等捆绑到一个分发文件中，例如vendor/foo/dist/foo-bundle.js 然后我可以导入到 Ember 中：

app.import("vendor/foo/dist/foo-bundle.js");

这看起来应该可以使用捆绑器 and/or 转译器（例如 Babel), but it isn't clear to me what tools I should use and in what combination. Does Ember have a built in tool for doing what I want through ember-cli (if it does, I must be blind)? Should I be using an external bundler like webpack, browserify, or rollup?

总的来说，JavaScript 工具似乎有很多杂音，这让我很难理解我对这个问题有哪些选择以及如何正确利用它们。如有任何帮助，我们将不胜感激。

一些可能有用的注释...

到目前为止，我已经尝试了一些方法：

我尝试只导入 main.js 文件，希望 EmberJS 也能遍历依赖树并导入在 import 语句中引用的任何其他文件。这只导入了 main.js 文件，没有其他依赖项。

我查看了 broccoli-es6modules and had errors when running it, but it also uses esperanto，它已被弃用以支持汇总。

我也尝试过直接使用 rollup，取得了很小的成功，但我的 bundle.js 输出经常是空的，并且不包含来自 bar.js 或 [=17 的代码=] 因为我只在入口点导入它们（例如 main.js）：

main.js
-------
import bar from './bar.js';
import baz from './baz.js';

bar.js
------
export default function bar() {
  ...
}

baz.js
------
export default function baz() {
   ...
}

我发现如果我的 main.js 包含一个调用来自 bar 或 baz 的代码的函数，我得到的不仅仅是一个空包，但如果 foo 只是一个集合来自第三方供应商的脚本没有 "application entry point"，除了相当于清单文件之类的东西之外，rollup 似乎不是我正在寻找的东西的错误选择。

再次感谢！

Answer 1

（已更新为最新选项。）

有几个选项。

如果baz.js和bar.js是自己的模块和代码，最好直接放在app/my-awesome-module文件夹下。您可以使用 ES6 import 在您想要使用它们的其他地方导入。 Ember CLI 将自动转换、连接和缩小它们。
如果您想使用 3rd 方模块或解决方案，请查看 http://emberobserver.com，大多数流行的库已经转换为 Ember 插件，因此您可以安装它们ember install.
在您的项目中使用 ember-auto-import 并将库作为普通 ES6 模块导入，如下所示：import MyCoolModule from "my-cool-module";

如何在 ember-cli 项目中将 JavaScript 文件捆绑在 /vendor 下？

How can I bundle JavaScript files under /vendor in an ember-cli project?

javascript

ember.js

ember-cli

babeljs

rollupjs