简单的JavaScript ES6与require()导入

qar*_*dso 3 javascript browserify ecmascript-6 babeljs javascript-import

我正准备通过babel使用ES6模块导入/导出,但在本文中遇到了这个令人困惑的声明.

它指出:

ES6的的功率importexport用结合require()的方法,使我们的自由,所有的客户端代码的组织成模块,并在同一时间写使用JavaScript的新版本的所有功率的代码.

这使它听起来像ES6的系统,并require()提供两种不同的目的,从而使这种babel/browserify方法成为最好的方法.我的理解是他们都做了同样的事情,只是有点不同.有人可以帮忙解释一下吗?

Mat*_*zer 9

这种说法是矛盾的.如果你进入ES6/ES7,你将不想使用CommonJS- style require,但你总是希望使用异步加载模块import.

事实上,ES6/ES7有一种编程方式导入模块:System.import(...)但是仍在讨论加载器规范 ......

在获得推荐状态之前,有一个polyfill(并且超过这个......):SystemJS.

从现在开始,我会避免使用任何其他模块加载语法,因为您的代码在几年内可以在标准Web浏览器中完美地执行,几乎没有任何修改.

OP在一些评论中问道......

当我们有ES6导入/导出模块加载功能时,为什么js模块需要来自ES6的System.import(...)?他们不是在执行相同的任务吗?

import语句只能位于代码文件的顶部.有时您会根据执行某种逻辑知道要加载哪些文件,并且import语法不支持条件.

例如,假设您有一个需要插件的应用程序,并且某些选项有一个标志loadPlugins,可以是truefalse.因此,如果应用程序需要加载它们,您将需要加载它们:

if(options.loadPlugins) {
   Promise.all(
      options.plugins.map(plugin => System.import(plugin.path))
   ).then(() => {
      // Do stuff when all plugins have been already loaded!
   });
}
Run Code Online (Sandbox Code Playgroud)