Next.js项目中如何通过@types目录导入TypeScript声明文件？

问题核心 #

TS6137错误是因为你尝试直接导入一个未被标记为模块的.d.ts文件——TypeScript会将无模块导出的.d.ts视为全局类型定义，不允许通过模块路径导入。

解决方案 #

1. 调整类型文件结构（二选一） #

方案A：改用.ts文件存储类型（推荐）

将types/ApiResponse.d.ts重命名为types/ApiResponse.ts，直接在文件中导出类型：

export interface ApiResponse {
  // 替换为你的实际类型定义
  data: Record<string, unknown>;
  statusCode: number;
}

方案B：将.d.ts转为模块文件

若需保留.d.ts后缀，在文件顶部添加模块标识，让TypeScript将其识别为模块：

export {}; // 必须添加这行，标记文件为模块

export interface ApiResponse {
  data: Record<string, unknown>;
  statusCode: number;
}

2. 修正tsconfig.json配置 #

确保配置中包含以下内容，让别名@types/*指向你的types目录：

{
  "compilerOptions": {
    "baseUrl": "./",
    "paths": {
      "@types/*": ["types/*"]
    },
    // 保留其他原有配置
  }
}

注意：typeRoots用于全局类型的自动加载，和模块类型的导入无关，无需依赖它解决此问题。

3. 正常导入类型 #

现在可以按你想要的方式导入类型：

import { ApiResponse } from "@types/ApiResponse";

这样就能彻底解决TS6137错误，实现别名导入类型的需求。

内容的提问来源于stack exchange，提问作者clint21.eth