如何动态导入本地TypeScript文件？解决TS2503命名空间找不到错误

问题场景 #

在Node 18环境下，尝试将同目录下MyInterfaces.ts中的接口动态导入到index.ts时，始终触发TS2503错误（找不到命名空间），两种写法均无效：

写法1：直接导出接口 #

// MyInterfaces.ts
export interface MyInterface1 {
  id: number;
  name: string;
}

// index.ts
async function importMyInterfaces() {
  const myInterfaces = await import("./MyInterfaces");
  const data1: myInterfaces.MyInterface1 = {
    id: 1,
    name: "John Doe",
  };
}

写法2：用命名空间包裹接口 #

// MyInterfaces.ts
export namespace MyInterfaces {
  export interface MyInterface1 {
    id: number;
    name: string;
  }
}

// index.ts
async function importMyInterfaces() {
  const {MyInterfaces} = await import("./MyInterfaces");
  const data1: MyInterfaces.MyInterface1 = {
    id: 1,
    name: "John Doe",
  };
}

当前使用的tsconfig.json配置：

{
  "compilerOptions": {
    "module": "commonjs",
    "noImplicitReturns": true,
    "noUnusedLocals": true,
    "outDir": "lib",
    "sourceMap": true,
    "strict": true,
    "target": "es2017"
  },
  "compileOnSave": true,
  "include": [
    "src"
  ]
}

问题根源 #

TypeScript中，接口、类型别名属于编译时类型，会在编译阶段被完全擦除，不存在于运行时代码中。而动态导入返回的是运行时模块对象，无法通过它引用编译时才存在的类型，TS会将myInterfaces.MyInterface1这类写法当成查找运行时命名空间，自然报错。

解决方案 #

方案1：静态导入类型+动态导入值（推荐） #

如果只是需要使用接口类型，直接静态导入即可；若模块中有导出运行时值，再配合动态导入：

// MyInterfaces.ts
export interface MyInterface1 {
  id: number;
  name: string;
}
// 示例导出运行时值
export const defaultName = "Guest";

// index.ts
// 静态导入类型（仅编译时生效，无运行时代码）
import type { MyInterface1 } from "./MyInterfaces";

async function importMyInterfaces() {
  // 动态导入运行时值
  const { defaultName } = await import("./MyInterfaces");
  const data1: MyInterface1 = {
    id: 1,
    name: defaultName,
  };
}

方案2：通过typeof提取动态模块的类型 #

如果必须关联动态导入的模块，可通过typeof获取模块的类型结构，再从中提取接口：

// MyInterfaces.ts
export interface MyInterface1 {
  id: number;
  name: string;
}

// index.ts
async function importMyInterfaces() {
  const myInterfaces = await import("./MyInterfaces");
  // 获取动态导入模块的类型
  type MyModuleType = typeof myInterfaces;
  // 从模块类型中提取目标接口
  type MyInterface1 = MyModuleType["MyInterface1"];
  
  const data1: MyInterface1 = {
    id: 1,
    name: "John Doe",
  };
}

方案3：调整模块配置（可选优化） #

Node 18原生支持ES模块，可修改tsconfig.json适配更现代的模块系统，减少CommonJS与ES模块的兼容问题：

{
  "compilerOptions": {
    "module": "ESNext",
    "moduleResolution": "node",
    "noImplicitReturns": true,
    "noUnusedLocals": true,
    "outDir": "lib",
    "sourceMap": true,
    "strict": true,
    "target": "es2017"
  },
  "compileOnSave": true,
  "include": [
    "src"
  ]
}

修改后需确保项目根目录的package.json中添加"type": "module"，或文件后缀改为.mts/.mjs。

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