如何连接ES6模块？ [英] How do I concatenate ES6 modules?

问题描述

如何连接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() {}

推荐答案

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

If what you want to do is create a single JavaScript file that does not internally use ES6 modules, so that you can use it with browsers/node today, then I recommend using Esperanto (full disclosure, I'm a maintainer of the project). It allows you to create a bundle that concatenates all of the files together without the use of a loader like you'd get using something like browserify or webpack. This typically results in smaller code (no loader), better dead code elimination (when using a minifier like Google Closure Compiler or UglifyJS), and better performance as the JS interpreter is better able to optimize the result.

以下是一个示例用法，但请注意，大量可集成的工具世界语进入您的工作流程：

Here's an example usage, but note that there are plenty of tools to integrate Esperanto into your workflow:

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页面。

这篇关于如何连接ES6模块？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！