简单的 Babel 转译 es6 模块加载答案

【问题标题】：Simple Babel transpiled es6 Module Loading简单的 Babel 转译 es6 模块加载
【发布时间】：2015-12-16 04:41:39
【问题描述】：

我正在为 babel 转译的导入/导出 es6 模块寻找简单模块加载。

我想避免使用 browserify、webpack、jspm 等。只需简单地转译 es6->es5 并使用库 babel 编译模块即可。我不需要捆绑。我们在这里谈论的是简单、基本的 javascript。

这可能吗？如果有，怎么做？！

我见过的所有模块加载讨论都使用了在我看来不必要的复杂工作流程。我想在一组文件中简单地使用 es6 导入/导出，并在浏览器中尽可能简单地使用它们。

【问题讨论】：

听起来您正在寻找转译到 AMD，然后使用像 require.js 这样的客户端库。
也看看 system.js
如果你想使用 ES6 导入/导出语法，你需要某种模块加载器。 RequireJS 会起作用，但我真的不确定使用它比其他方法获得什么。如果有的话，我认为 AMD 比 Browserify 更复杂。我通常认为“简单转译的 es6->es5”与“仅使用 es6 导入/导出”不一致。
您可以使用babel-global-variables。 simple 的定义非常简单，但放弃了 ES6 模块加载的许多优点......但我再次同意 loganfsmyth，Browserify 非常简单 - 它是一个单一的 CLI 命令
在这里操作。不好意思说我不知道如何使用browserify进行模块加载！我不在我的一般（gulp）工作流程中使用它。据我了解，它用于将 npm 存储库转换为浏览器使用。有一个简单的 gulp 任务可以解决问题吗？

【解决方案1】：

这是我给我的团队的一个演讲，细节在最后： http://backspaces.net/temp/Modules.pdf

简短的版本是：将 babel 配置为具有 babel-plugin-transform-es2015-modules-systemjs，通过 babel 运行您的模块，除非您需要更多 es6 功能（Chrome 已完成 91%），并且让你的 html 包括：

<script src="system.js"></script>
and
<script>
  System.import('lib/main'); 
</script>

没有 webpack、npm/browserify、jspm、捆绑……或任何其他（太多）模块工作流程。

【讨论】：

【解决方案2】：

您似乎可以使用babel-cli 来做您想做的事。也许像babel src --out-dir lib。

【讨论】：