System.import() 和 import() 有何不同？

Question

在webpack 1文档中有这样的说法，在webpack 2中将使用System.import()进行动态加载：

幸运的是，正在编写一个JavaScript API“loader”规范来处理动态使用情况：System.load（或System.import）。该API将是上述require变体的本地等效项。

在那段时间内，网络上到处都是使用System.import()的示例。

---

在发布webpack 2之前, 作者决定将 System.import() 更改为 import():

添加 import() 作为代码分离构造。尽可能使用它来代替 System.import。 System.import 将在 webpack 2 发布时被弃用 (在 webpack 3 中将被移除) 因为它的行为不符合规范。

这个 import() 基于 tc39/proposal-dynamic-import 规范，您可以在 这里 阅读更多关于他们为什么做出这个变化的解释。

---

有人能解释一下System.import()和import()之间的区别吗？

尽管名称不同，但用法看起来相同：

import(modulePath)
  .then(module => module.default())
  .catch(/* ... */);

System.import(modulePath)
  .then(module => module.default())
  .catch(/* ... */);

但是在webpack 2的文档中写道：“System.import()的行为与规范不符”，因此它表明System.import()和import()之间存在差异。

- Everettss

---

如果我正确理解您提供的链接，一个非常重要的区别是import()知道调用它的脚本或模块，而System.import()则不知道。如果我是正确的，这意味着import('../foo')，即相对于当前模块的解析是可能的。但是我也可能错了，请纠正我。 - Nikos Paraskevopoulos

看起来这个差异源自于这个Github问题。 - Milan

Answer 1

这就是你需要的内容：tc39提案中涉及到的实际函数 集成加载器（Loader）的初稿曾经包含了名为System.import()或System.loader.import()等实际函数（不只是类似函数的语法形式），它们可以完成相同的使用场景。但最大的问题是，正如规范编辑人员之前指出的那样，如何解释这些函数的specifier参数。由于它们只是函数，在整个领域内都是相同的，并且不会因为脚本或模块而有所不同，因此无论从哪里调用这些函数，它们必须以相同的方式解释其参数。（除非实现某种真正奇怪的堆栈检查）因此，可能会遇到与上面的importModule函数中的文档基础URL问题类似的问题，其中相对模块specifier变得混乱，并使任何附近的导入声明不匹配。

- Michael Ryan Soileau