tsconfig 使用详解
说明 tsconfig.json 如何定义 TypeScript program 的边界、编译选项与项目引用规则。
#tech / dev
#resource / typescript
#type / concept
#status / growing
[!info] related notes
tsconfig 使用详解
基础概念
tsconfig.json 是 TypeScript 编译器选项与文件边界的配置文件,用来定义一个 TypeScript program 应该如何被理解、检查和构建。
使用指南
单包项目的最小例子
{
"compilerOptions": {
"target": "ES2022",
"module": "ESNext",
"rootDir": "src",
"outDir": "dist",
"strict": true,
"esModuleInterop": true,
"declaration": true
},
"include": ["src/**/*"]
}
Monorepo 示例
{
"extends": "../../tsconfig.base.json",
"compilerOptions": {
"composite": true,
"declaration": true,
"outDir": "dist",
"rootDir": "src"
},
"include": ["src/**/*"]
}
按知识结构看常见选项
program 边界与输出结构
类型检查基线
- 这些选项回答的是“这个项目以多严格的类型规则、什么语法目标、什么标准库类型和什么 JSX emit 策略被理解”。
- TypeScript 中的 strict
- TypeScript 中的 noImplicitAny
- TypeScript 中的 noImplicitThis
- TypeScript 中的 strictNullChecks
- TypeScript 中的 strictFunctionTypes
- TypeScript 中的 strictBindCallApply
- TypeScript 中的 strictBuiltinIteratorReturn
- TypeScript 中的 alwaysStrict
- TypeScript 中的 strictPropertyInitialization
- TypeScript 中的 noUncheckedIndexedAccess
- TypeScript 中的 noPropertyAccessFromIndexSignature
- TypeScript 中的 exactOptionalPropertyTypes
- TypeScript 中的 useUnknownInCatchVariables
- TypeScript 中的 noImplicitOverride
- TypeScript 中的 target
- TypeScript 中的 lib
- TypeScript 中的 jsx 编译选项
- TypeScript 中的 jsxImportSource
- TypeScript 中的 useDefineForClassFields
控制流与代码卫生
- TypeScript 中的 noImplicitReturns
- TypeScript 中的 noFallthroughCasesInSwitch
- TypeScript 中的 noUnusedLocals
- TypeScript 中的 noUnusedParameters
- TypeScript 中的 allowUnreachableCode
- TypeScript 中的 allowUnusedLabels
JS 共存与迁移
全局类型与声明文件边界
声明与项目构建
- TypeScript 中的 declaration 与 declarationMap
- TypeScript 中的 declarationDir
- TypeScript 中的 emitDeclarationOnly
- TypeScript 中的 composite
- TypeScript 中的 references
- TypeScript 中的 incremental
- TypeScript 中的 tsBuildInfoFile
模块系统与模块解析
- TypeScript 中的 module
- TypeScript 中的 moduleDetection
- TypeScript 中的 moduleResolution
- TypeScript 中的 nodenext 与 bundler
- TypeScript 中 module 与 moduleResolution 的关系
- Node、bundler 与 TypeScript 模块解析的关系
- TypeScript 中的 customConditions
- TypeScript 中的 resolvePackageJsonExports
- TypeScript 中的 resolvePackageJsonImports
- TypeScript 中的 moduleSuffixes
- TypeScript 中的 resolveJsonModule
- TypeScript 中的 allowImportingTsExtensions
- TypeScript 中的 rewriteRelativeImportExtensions
模块互操作与单文件转译
- TypeScript 中的 esModuleInterop
- TypeScript 中的 allowSyntheticDefaultImports
- TypeScript 中的 verbatimModuleSyntax
- TypeScript 中的 isolatedModules
已被替代的旧模块 emit 选项
路径映射与虚拟目录
经验总结
- 单仓项目先关注 include/exclude、strict、module、target 这些基本边界。
- monorepo 项目再进一步关注
composite、declaration、references与包边界。 tsconfig越往后越不适合继续堆在一篇总览里;一旦出现模块解析、产物目录、project references 这些稳定主题,就值得拆成原子页。
参考信息
- TypeScript 官方:Project References — https://www.typescriptlang.org/docs/handbook/project-references.html
- tsconfig options — https://www.typescriptlang.org/tsconfig
- Nx monorepo guide — https://nx.dev
baseUrl— https://www.typescriptlang.org/tsconfig/baseUrl.htmlpaths— https://www.typescriptlang.org/tsconfig/paths.html- TypeScript 6.0 Release Notes — https://www.typescriptlang.org/docs/handbook/release-notes/typescript-6-0.html