如何在动态导入中使用类型?

MrV*_*doo 6 dynamic-import typescript angular

我在 Angular 7 中使用动态导入来减小初始供应商包的大小。

import('xlsx').then(XLSX => {
    const wb: XLSX.WorkBook = XLSX.read(bstr, { type: 'binary' });
})
Run Code Online (Sandbox Code Playgroud)

但是XLSX.WorkBook类型上有一个错误,提示“找不到命名空间 XLSX”。
XLSX.read 工作正常。

问题:使用动态导入时如何定义类型?

Tit*_*mir 7

XLSX 将只代表导入的值,而不是类型。

你有两个选择。

使用导入类型:

import('xlsx').then(XLSX => {
    const wb: import('xlsx').WorkBook = XLSX.read(bstr, { type: 'binary' });
})
Run Code Online (Sandbox Code Playgroud)

您可以定义一个类型别名以使其更容易: type WorkBook = import('xlsx').WorkBook

导入类型:

import { WorkBook } from 'xlsx' // Just for the type, will be elided in this example

import('xlsx').then(XLSX => {
    const wb: WorkBook = XLSX.read(bstr, { type: 'binary' });
})
Run Code Online (Sandbox Code Playgroud)

这第二个选项更难正确,如果您只在类型中使用来自静态导入​​的导入,则应该省略导入语句(即不输出到 JS)。只要您在表达式中使用来自静态导入​​的任何导入(即,将在 JS 中结束的任何位置),导入将不会被省略。查看更多关于被省略的模块