TypeScript配置自定义typeRoots时如何通过入口导出全局类型
实现方案
核心逻辑
完全保留现有全局类型配置,无需修改原有业务类型定义、也不用在入口重复声明类型,仅需2个小调整即可同时满足内部开发、外部使用的需求。
具体操作
1. 新增类型聚合入口文件
在src/types/下新建index.d.ts,专门用来把全局类型转成可导出的模块类型,原有foo.d.ts等业务类型文件完全不用动:
// src/types/index.d.ts // 顶层带export的文件会被识别为模块,而非全局脚本 // 直接引用全局作用域的类型做导出别名,无需重复声明类型结构 export type Foo = Foo; export type 其他业务类型名 = 其他业务类型名;
原有
src/types/foo.d.ts保持现有写法即可,依然是全局声明,内部开发时不用导入就能直接使用Foo。
2. 在项目入口导出类型聚合文件
修改src/index.ts,把类型聚合文件导出,原有业务代码完全不需要调整:
// src/index.ts // 导出所有类型,外部使用者可直接从包名导入 export * from './types/index.d'; // 原有业务代码保持不变,Foo仍然是全局类型,无需导入就能使用 export const HelloWorld = (input: Foo) => console.log("hello world", input.bar);
打包适配
现有rollup配套的TS插件(无论是@rollup/plugin-typescript还是rollup-plugin-typescript2)都会自动处理这些导出,配合tsconfig里的declaration: true配置,生成的index.d.ts会自动带上所有导出的类型。包使用者不需要额外配置typeRoots,可直接按照预期方式导入:
import { HelloWorld, Foo } from 'your-package-name'; const input: Foo = { bar: "hi" }; HelloWorld(input);
优化提示:如果
src/types下的类型很多,手动写导出别名效率低,可以写个简单的Node脚本遍历所有业务.d.ts文件,自动生成导出别名列表,避免重复劳动。
和你提到的Stack Overflow回答的思路对比
二者核心逻辑完全一致,都是「全局声明 + 模块导出」双模式的实现:
- 你提到的回答是针对单个类型文件的场景,直接在同一个
.d.ts文件里同时做全局声明、模块导出 - 本方案针对多类型文件、不想改动原有业务类型定义的场景,把全局声明和模块导出拆成了独立文件,不需要修改原有类型代码,更适合多类型项目维护
内容的提问来源于stack exchange,提问作者jan
相关产品推荐
相关产品推荐

