开启strictNullChecks时动态导入类型推断失败问题排查

问题现象 #

同样的动态导入代码，在StackBlitz中能正常完成类型推断，但本地环境下出现异常：

• 当使用链式then写法时，类型推断完全失效：

factory: () => import('./shared/data/data.module').then(mod => mod.createDataModule)

• 仅改用async/await写法时，类型推断才能正常工作：

factory: async () => (await import('./shared/data/data.module')).createDataModule,

模块导出内容完全一致：

export function createDataModule() {
  return {
    services: {
      createResource: () => {},
    },
  };
}

关键排查线索 #

将tsconfig中的strictNullChecks设为false后，问题可解决。推测该问题与TypeScript在严格空检查模式下，对import返回值的有效性校验逻辑相关。

本地TypeScript配置详情 #

当前项目的compilerOptions配置：

"compilerOptions": {
  "esModuleInterop": true,
  "forceConsistentCasingInFileNames": true,
  "importsNotUsedAsValues": "error",
  "outDir": "../../dist/out-tsc",
  "module": "esnext",
  "preserveValueImports": true,
  "skipLibCheck": true,
  "sourceMap": true,
  "strict": true,
  "types": ["node", "@cloudflare/workers-types"]
},

继承的基础配置：

"rootDir": ".",
"sourceMap": true,
"declaration": false,
"moduleResolution": "node",
"downlevelIteration": true,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"importHelpers": true,
"target": "es2018",
"module": "esnext",
"lib": ["es2019", "dom"],
"skipLibCheck": true,
"skipDefaultLibCheck": true,
"baseUrl": ".",

使用的TypeScript版本为4.7.4。

核心疑问与需求 #

1. 本地环境中具体是哪个配置导致import+then的写法无法正常进行类型推断？
2. 若这是一个允许用户自由选择导入写法的API，如何在类型定义层面同时兼容两种导入方式？

内容的提问来源于stack exchange，提问作者Andy Jessop