es6模块如何加载工作 [英] How does es6 module loading work

问题描述

我已阅读 about es6模块加载程序，我只是不太明白它是如何工作的，希望有人能够启发我。

I've been reading about es6 module loaders and I just don't quite understand how it works and am hoping someone can enlighten me.

在上面的实际工作流程中，他们有一个这样的例子

In the practical workflows link above they have an example like this

System.import('app/app').then(function(app) {
  // app is now the Module object with exports as getters
});

没有问题 - 我得到它。但是我看到这样的东西

No problem with that - I get it. But then I see stuff like this

var $ = require('jquery');

，真的很困惑。如果在此调用jquery尚未传输到浏览器时会发生什么？线程是否旋转？浏览器会在幕后解析您的脚本，并将其改为像RequireJs这样的回调吗？它是可配置的吗？有没有特定的限制？

and get really confused. What happens if at the time of this call jquery has not yet been transferred to the browser? Does the thread just spin? Does the browser parse your script behind-the-scenes and reform it into a callback like RequireJs does? Is what it does configurable? Are there specific limitations?

有人可以给我一个破解吗？

Can someone give me a rundown?

推荐答案

p> ES6模块加载程序将获取源，确定依赖关系，并等待这些依赖关系在执行模块之前加载。所以在需求执行时，依赖关系已经在等待执行了。

The ES6 Module Loader will fetch the source, determine dependencies, and wait until those dependencies have loaded before executing the module. So by the time the require executes, the dependency is already sitting there waiting to be executed.

当通过ES6模块加载器加载CommonJS时，我们依靠静态解析需要来自源的语句，只有在需要的时候才执行源代码。

When loading CommonJS through an ES6 module loader, we rely on statically parsing out the require statements from the source, and only executing the source once those requires have loaded.

这样我们可以在浏览器中动态加载CommonJS。循环引用的处理方式与Node中处理的方式相同。

In this way we can support CommonJS in the browser loaded dynamically. Circular references are treated identically to the way they are handled in Node.

解析请求的正则表达式实际上是非常可靠和快速的，同时考虑到注释和周围令牌。请参阅 https://github.com/systemjs/systemjs/ blob / master / lib / extension-cjs.js＃L10 为SystemJS使用的一个。

The regular expressions parsing out the require are actually pretty reliable and quick, while taking into account comments and surrounding tokens. See https://github.com/systemjs/systemjs/blob/master/lib/extension-cjs.js#L10 for the one used by SystemJS.

这种方法还有一个限制，动态和条件的CommonJS需要像 if（condition）require（'some'+'name'）没有被正确检测到。这使得CommonJS在浏览器中作为完全异步的模块格式成为必要的代价。

There is one remaining limitation with this approach and that is dynamic and conditional CommonJS requires like if (condition) require('some' + 'name') aren't detected properly. This is a necessary cost though to make CommonJS behave as a fully asynchronous module format in the browser.

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