javascript - 如何连接 ES6 模块？

Question

如何连接 ES6 模块？

var foo = 2; // This would normally be scoped to the module.
export function Bar() {}

// ...concatenate...

import { Bar } from 'javascripts/bar' //This file no longer exists in the concatenated scenario.
export function Bam() {}

Answer 1

2020-09-02 更新： Esperanto 不久前被Rollup取代，是解决此问题的绝佳选择。根据你的需要，Webpack也可能是一个不错的选择。

---

如果您要做的是创建一个内部不使用 ES6 模块的单个 JavaScript 文件，以便您现在可以在浏览器/节点上使用它，那么我建议使用世界语（完全公开，我是该项目的维护者） . 它允许您创建一个捆绑包，将所有文件连接在一起，而无需像使用 browserify 或 webpack 那样使用加载器。这通常会导致更小的代码（无加载器）、更好的死代码消除（当使用像 Google Closure Compiler 或 UglifyJS 这样的压缩器时）以及更好的性能，因为 JS 解释器能够更好地优化结果。

这是一个示例用法，但请注意，有很多工具可以将世界语集成到您的工作流程中：

var fs = require( 'fs' );
var esperanto = require( 'esperanto' );

esperanto.bundle({
  base: 'src', // optional, defaults to current dir
  entry: 'mean.js' // the '.js' is optional
}).then( function ( bundle ) {
  var cjs = bundle.toCjs();
  fs.writeFile( 'dist/mean.js', cjs.code );
});

这个例子取自关于捆绑 ES6 模块的 wiki 页面。

Answer 2

我建议你看一下http://webpack.github.io，然后将它与babel结合起来。

或者，您可以单独使用 babel：

https://babeljs.io/docs/usage/cli/