import - 在 TypeScript 中动态导入模块

Question

TypeScript 动态加载模块的方式是什么（模块的路径在运行时已知）？我试过这个：

var x = "someplace"
import a = module(x)

但似乎 TypeScript 编译器希望在编译时将路径视为 import/module 中的字符串：

$ tsc test.ts 
/tmp/test.ts(2,19): error TS1003: Identifier expected.
/tmp/test.ts(2,20): error TS1005: ';' expected.

我知道我可以例如直接使用 RequireJS（如果我使用 amd 模块格式），但这对我来说感觉不对 - 它是一个特定库的解决方案。

score 53 · Accepted Answer

从 TypeScript 2.4 开始支持ES 提案动态导入。文件在这里。

import函数是异步的并返回一个Promise.

var x = 'someplace';
import(x).then((a) => {
  // `a` is imported and can be used here
});

或使用async/await：

async function run(x) {
  const a = await import(x);
  // `a` is imported and can be used here
}

score 12 · Accepted Answer

您需要指定一个硬编码字符串。变量将不起作用。

更新

JavaScript 现在有了动态导入。所以你可以这样做import(x)：https ://developers.google.com/web/updates/2017/11/dynamic-import

TypeScript 也支持它。也就是说，您仍然希望参数可以静态分析以实现类型安全，例如

const x = 'someplace';
import(x).then((a) => { // TypeScript knows that `x` is 'someplace' and will infer the type of `a` correctly
});