TypeScript、tsc、tsconfig 与 tsserver 的关系
说明 TypeScript 语言本体、编译器 tsc、配置文件 tsconfig 和语言服务 tsserver 之间的职责分工与协作关系。
#tech / dev
#resource / typescript
#type / synthesis
#status / growing
[!info] related notes
TypeScript、tsc、tsconfig 与 tsserver 的关系
范围
这篇笔记只讨论 TypeScript 主工具链内部的职责分工,不讨论具体 bundler 或框架插件。
为什么要放在一起理解
很多人在学习 TypeScript 时,会把这几个名字混成一层:
- TypeScript
tsctsconfigtsserver
但它们分别回答的是不同问题。
依赖路径 / 调用链 / 演进链
TypeScript
TypeScript 是语言和类型系统本体,定义了:
- 语法扩展
- 类型系统
- 类型推断与收窄规则
tsconfig
tsconfig 定义一个 TypeScript program 的边界与配置规则,决定:
- 哪些文件被纳入检查
- 模块如何解析
- 最终输出采用什么模块格式
- 是否生成声明文件
- 是否启用 project references
这部分常见子主题包括:
- TypeScript 中的 strict
- TypeScript 中的 target
- TypeScript 中的 types 编译选项
- TypeScript 中的 module
- TypeScript 中的 esModuleInterop
- TypeScript 中的 moduleResolution
- TypeScript 中的 rootDir
- TypeScript 中的 outDir
- TypeScript 中的 incremental
tsc
tsc 读取源码和 tsconfig,执行:
- 类型检查
- 编译输出
- build mode 构建
tsserver
tsserver 常驻在编辑器后面,复用 TypeScript 的语言服务能力,为 IDE 提供:
- 补全
- 跳转
- hover
- 语义诊断
对比与易混淆点
tsc 和 tsserver 都会“报错”,但场景不同
tsc更偏命令行检查和构建tsserver更偏编辑器中的即时反馈
tsconfig 不是单纯的“编译选项集合”
它还决定了整个 program 的边界,因此很多“为什么这个文件也被算进来了”的问题,本质是 tsconfig 问题。
TypeScript 不是单个二进制工具
把 TypeScript 理解成“语言 + 编译器 + 配置系统 + 语言服务”的整体,会比把它理解成一个命令更准确。