module - 简单的 Babel 转译 es6 模块加载

Question

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

• 从带有导入/导出模块的 es6 源文件开始，以便在浏览器中使用
• 使用 babel 将其静态转换为 es5，并通过配置指定最容易加载的模块转换（amd、commonjs、systemjs）。
• 不要将 npm 用于模块，也不要使用任何其他复杂的工作流程。只是 babel 转译的文件。
• 使用模块加载这些 es5 文件，并使用 a<script>加载 babel 转译用于加载 es6 模块的库。

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

这可能吗？如果是这样，怎么办？！

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

Answer 1

Guy Bedford 在 SystemJS Google Group 中回答了这个问题： https ://groups.google.com/forum/?hl=en#!topic/systemjs/a7vB2YmdXp8

这是我给我的团队的一个演讲，细节在最后： 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、bundling、...或任何其他（太多）模块工作流。

Answer 2

看起来你可以使用babel-cli来做你想做的事。也许像babel src --out-dir lib.