此页面由社区从英文翻译而来。了解更多并加入 MDN Web Docs 社区。

View in English Always switch to English

import.defer()

有限可用

此特性不属于基线,因为它尚未在主流浏览器中得到支持。

Want more browser support for this feature? Tell us why.

实验性: 这是一项实验性技术
在将其用于生产之前,请仔细检查浏览器兼容性表格。

import.defer() 语法的行为与普通的 import() 语法类似,但它返回的是一个延迟模块命名空间对象。模块及其依赖会先被获取并链接,但它们的同步执行会延迟到访问命名空间的属性时才发生。

关于延迟执行(包括它与顶层 await 的交互)的更多信息,请参阅 import defer 声明形式。

语法

js
import.defer(moduleName)
import.defer(moduleName, options)

import.defer() 是一种特殊语法(“元属性”),而不是 import 对象上的方法。

参数

请参阅 import()。

返回值

在模块图加载并链接完成,且所有立刻执行的顶层 await 依赖完成执行之后,返回一个会兑现为延迟模块命名空间对象的 promise。

与普通的 import() 一样,如果模块或其依赖无法加载、解析或链接,该 promise 会被拒绝。如果某个立刻执行的模块抛出错误,它也会被拒绝。而仍处于延迟阶段的执行错误,则会由触发执行的命名空间操作以同步方式抛出。

示例

使用 import.defer()

备注:可以保证,对返回的 Promise 进行 await 时不会意外调用导出的 then 方法——这是普通模块命名空间对象常见的陷阱——因为延迟模块命名空间对象永远不会暴露名为 then 的属性。

js
const ts = await import.defer("typescript");

function compilePath(path) {
  // typescript 模块子图的执行从这里开始
  const program = ts.createProgram([path], {});
}

不要立即解构返回的命名空间,因为这会触发执行:

js
const { createProgram } = await import.defer("typescript");
// typescript 模块现在已经被执行。

规范

规范
Deferred Imports Evaluation
# sec-left-hand-side-expressions

浏览器兼容性

参见