TypeScript(tsconfig.json - 全描述)

252 阅读20分钟

TypeScript 配置(tsconfig.json)完全指南

本文基于 TypeScript 官方文档(www.typescriptlang.org/tsconfig/)整理,系统梳理 tsconfig.json 的核心配置分类、字段含义、默认值及使用场景,帮助开发者快速理解和配置 TypeScript 项目。

一、TSConfig 核心概念

TSConfig 文件(通常命名为 tsconfig.json)用于标识 TypeScript/JavaScript 项目的根目录,并定义项目的编译选项、文件范围、依赖关系等配置。其核心作用是:

  1. 告诉 TypeScript 编译器如何处理项目代码;
  1. 统一项目的类型检查、模块解析、输出格式等规则;
  1. 支持多项目依赖管理(通过项目引用)和编译优化。

二、顶层配置(Root Fields)

顶层配置直接定义在 tsconfig.json 根节点,用于控制项目的整体结构和文件范围,不包含在 compilerOptions 中。

配置字段中文含义功能描述默认值生效版本
files文件列表指定项目中需包含的具体文件路径(数组形式),文件不存在会报错,适合少量文件场景。false
-(未指定时为空数组)
1.5
extends继承配置指定另一个 TSConfig 文件的路径,实现配置继承(基础配置先加载,子配置覆盖冲突项)。⚠️ 注意:references 字段不支持继承。false2.1
include包含文件 / 模式指定需包含的文件或 glob 模式(如 src/**/*),路径相对于 tsconfig.json 所在目录。若指定 files 则为 [],
否则为 */
2.0
exclude排除文件 / 模式指定需从 include 中排除的文件或模式,仅影响 include 的结果,不阻止通过 import/reference 引入文件。node_modules、
bower_components、
jspm_packages、
outDir
2.0
references项目引用定义多项目依赖关系,将大型项目拆分为子项目,支持隔离编译和依赖复用(需子项目开启 composite: true)。false(空数组)3.0

顶层配置示例

{
  "extends": "./configs/base.json", // 继承基础配置
  "files": ["core.ts", "app.ts"],   // 指定核心文件
  "include": ["src/**/*", "tests/**/*"], // 包含src和tests下所有文件
  "exclude": ["node_modules", "src/**/*.test.ts"], // 排除node_modules和测试文件
  "references": [                   // 引用子项目
    { "path": "./packages/utils" },
    { "path": "./packages/components" }
  ]
}

三、编译器选项(compilerOptions)

compilerOptions 是 TSConfig 的核心,包含类型检查、模块处理、输出控制等细分配置,按功能分为 13 大类。

1. 类型检查(Type Checking)

控制 TypeScript 的类型严格性,确保代码类型安全,减少运行时错误。

配置字段中文含义功能描述默认值生效版本
allowUnreachableCode允许不可达代码控制是否忽略 / 报错不可达代码(如 return 后的代码)。
- undefined:编辑器警告;
- true:忽略;
- false:报错。
undefined1.8
allowUnusedLabels允许未使用标签控制是否忽略 / 报错未使用的标签(如循环标签)。
- 取值逻辑同 allowUnreachableCode。
undefined1.8
alwaysStrict始终严格模式确保代码按 ES 严格模式解析,并在输出 JS 中添加 "use strict"。true(若 strict: true);否则 false2.1
exactOptionalPropertyTypes严格可选属性类型禁止可选属性(? 修饰)赋值为 undefined,仅允许声明的类型或不定义该属性。false4.4
noFallthroughCasesInSwitch禁止 switch 贯穿报错 switch 语句中未加 break/return/throw 的贯穿 case。false1.8
noImplicitAny禁止隐式 any当变量 / 参数类型隐含为 any 时报错,强制显式声明类型。true(若 strict: true);否则 false1.0
noImplicitOverride禁止隐式重写派生类重写父类方法时,必须添加 override 修饰符,避免意外重写。false4.3
noImplicitReturns禁止隐式返回检查函数所有代码路径是否显式返回值,避免遗漏返回逻辑。false1.8
noImplicitThis禁止隐式 this当 this 类型隐含为 any 时报错,强制明确 this 类型。true(若 strict: true);否则 false2.0
noPropertyAccessFromIndexSignature禁止索引签名用点访问索引签名声明的属性(如 [key: string]: string)必须用 obj["key"] 访问,而非 obj.key。false4.2
noUncheckedIndexedAccess检查索引访问索引访问时自动添加 undefined 类型(如 arr[0] 为 `Tundefined`),避免越界错误。false
noUnusedLocals禁止未使用局部变量未读取的局部变量报错。false2.0
noUnusedParameters禁止未使用参数未读取的函数参数报错。false2.0
strict开启所有严格检查一键启用所有严格模式选项(如 noImplicitAny、strictNullChecks 等),推荐生产环境开启。false2.3
strictBindCallApply严格检查 bind/call/apply确保 bind/call/apply 的参数与原函数参数类型匹配。true(若 strict: true);否则 false3.2
strictBuiltinIteratorReturn严格内置迭代器返回值内置迭代器的 TReturn 类型设为 undefined(而非 any),提升类型安全性。true(若 strict: true);否则 false5.6
strictFunctionTypes严格函数类型函数赋值时严格检查参数和返回值的子类型兼容性(仅对函数语法生效,方法语法不生效)。true(若 strict: true);否则 false2.6
strictNullChecks严格空值检查区分 null/undefined 与其他类型,禁止直接使用可能为 null/undefined 的值。true(若 strict: true);否则 false2.0
strictPropertyInitialization严格属性初始化类属性必须在构造函数中初始化或设为可选(undefined),否则报错。true(若 strict: true);否则 false2.7
useUnknownInCatchVariablesCatch 变量用 unknown将 catch 语句中异常变量的类型设为 unknown(而非 any),强制显式类型判断。true(若 strict: true);否则 false4.4

2. 模块配置(Modules)

控制模块解析、导入导出语法及模块系统类型,适配不同运行时(如 Node.js、浏览器 bundler)。

配置字段中文含义功能描述默认值生效版本
allowArbitraryExtensions允许任意扩展名导入允许导入非 JS/TS 扩展名的文件(如 .css/.svg),需配合对应 .d.ts 声明文件。false5.0
allowImportingTsExtensions允许导入 TS 扩展名允许导入时包含 .ts/.tsx/.mts 等 TS 扩展名(需开启 noEmit 或 emitDeclarationOnly)。true(若 rewriteRelativeImportExtensions: true);否则 false5.0
allowUmdGlobalAccess允许 UMD 全局访问模块文件中可直接访问 UMD 模块的全局变量(如 jQuery 的 $),无需 import。false3.5
baseUrl基础目录解析非相对模块名(如 import "utils")的基础目录,常与 paths 配合使用。./(若未指定,默认相对于 tsconfig.json)2.0
customConditions自定义解析条件解析 package.json 的 exports/imports 字段时,额外添加自定义条件(如 my-condition)。[]5.0
module模块系统指定生成的模块代码格式,适配不同运行时:
- commonjs:Node.js 传统模块;
- node16/nodenext:现代 Node.js(支持 ESM/CJS 自动切换);
- esnext/es2022:浏览器 bundler(如 Webpack);
- preserve:保留输入的导入导出格式。
commonjs(若 target: ES5);否则 es61.0
moduleResolution模块解析策略指定模块查找算法:
- node10:旧版 Node.js(仅 CJS);
- node16/nodenext:现代 Node.js(ESM/CJS 双支持);
- bundler:适配 bundler(如 Vite/Rollup,无需文件扩展名);
- classic:TS 早期策略(不推荐)。
随 module 自动匹配(如 module: commonjs 对应 node10)1.6
moduleSuffixes模块后缀列表解析模块时优先查找的后缀(如 [".ios", ".native", ""],适配 React Native 多平台)。[]4.7
noResolve禁止自动解析禁止 TS 自动解析 import/reference 引入的文件,需手动确保依赖存在。false1.0
noUncheckedSideEffectImports检查副作用导入副作用导入(如 import "./style.css")若无法找到文件则报错,避免拼写错误。false5.6
paths模块路径映射重写模块导入路径(基于 baseUrl),如将 import "jquery" 映射到 ./vendor/jquery。{}2.0
resolveJsonModule解析 JSON 模块允许导入 .json 文件,并自动生成其类型(基于 JSON 静态结构)。false2.9
resolvePackageJsonExports解析 package.json 的 exports解析模块时优先使用 package.json 的 exports 字段(控制包的导出入口)。true(若 moduleResolution: node16/nodenext/bundler);否则 false5.0
resolvePackageJsonImports解析 package.json 的 imports解析以 # 开头的导入时,使用 package.json 的 imports 字段(包内私有路径映射)。true(若 moduleResolution: node16/nodenext/bundler);否则 false5.0
rewriteRelativeImportExtensions重写相对导入扩展名将 TS 扩展名(.ts/.tsx)在输出 JS 中替换为对应 JS 扩展名(如 .js/.jsx)。false5.7
rootDir源代码根目录指定源代码根目录,确保输出目录(outDir)保留与源代码一致的目录结构。所有非声明输入文件的最长公共路径(若 composite: true,则为 tsconfig.json 所在目录)1.5
rootDirs虚拟根目录列表将多个目录视为 “虚拟根目录”,允许跨目录的相对导入(如 src/views 和 generated/templates/views 合并为一个根)。基于输入文件计算2.0
typeRoots类型根目录指定类型声明文件(.d.ts)的目录(默认包含 node_modules/@types),仅加载该目录下的类型包。["node_modules/@types"]2.0
types指定类型包仅加载指定的 @types 包(如 ["node", "jest"]),其他 @types 包不加载。加载所有可见 @types 包2.0

3. 输出控制(Emit)

控制 TypeScript 编译后的文件输出(如 JS 文件、类型声明、源映射等)。

配置字段中文含义功能描述默认值生效版本
declaration生成类型声明为每个 TS/JS 文件生成 .d.ts 类型声明文件(描述模块对外 API)。true(若 composite: true);否则 false1.0
declarationDir类型声明输出目录指定 .d.ts 文件的输出根目录(默认与 JS 文件同目录)。./2.0
declarationMap生成类型声明源映射为 .d.ts 文件生成源映射(.d.ts.map),支持编辑器 “跳转至原 TS 文件”。false2.9
downlevelIteration降级迭代支持为 ES5 环境生成更兼容的迭代代码(如 for...of、数组展开),依赖 Symbol.iterator。false2.3
emitBOM生成 UTF-8 BOM输出文件开头添加 UTF-8 字节顺序标记(BOM),适配部分需 BOM 的运行环境。false1.0
emitDeclarationOnly仅生成类型声明只输出 .d.ts 文件,不输出 JS 文件(适合用其他工具 transpile JS 的场景)。false2.8
importHelpers导入辅助函数从 tslib 导入编译辅助函数(如 __spreadArray),减少代码重复(需安装 tslib)。false2.1
inlineSourceMap内联源映射将源映射内容嵌入 JS 文件(而非生成单独 .map 文件),适合不允许 .map 文件的场景。false1.5
inlineSources内联源代码将原 TS 源代码嵌入到 JS 文件的源映射中,便于调试(需配合 inlineSourceMap 或 sourceMap)。false1.5
mapRoot源映射根目录指定调试器查找源映射文件的路径(替代默认生成路径)。""1.5
newLine换行符类型指定输出文件的换行符:crlf(Windows)或 lf(Unix/Linux/Mac)。跟随操作系统1.5
noEmit禁止输出文件仅执行类型检查,不生成任何 JS/.d.ts/ 源映射文件。false1.0
noEmitHelpers禁止生成辅助函数不生成编译辅助函数(需手动提供或通过 importHelpers 导入)。false1.8
noEmitOnError报错时禁止输出若存在类型检查错误,不生成任何输出文件,避免错误代码上线。false1.5
outDir输出目录指定所有编译产物(JS/.d.ts/ 源映射)的输出目录。与源文件同目录1.5
outFile合并输出文件将所有输出打包为单个 JS 文件(仅支持 amd/system 模块系统),若开启 declaration 则同时打包 .d.ts。""1.5
preserveConstEnums保留 const 枚举不删除 const enum 声明(默认会将枚举值直接替换为常量,保留后便于调试)。false1.5
removeComments移除注释输出文件中不保留注释(减少文件体积)。false1.5
sourceMap生成源映射为 JS 文件生成单独的源映射文件(.map),便于调试原 TS 代码。false1.5
sourceRoot源代码根路径指定调试器查找原 TS 代码的根路径(用于远程调试)。""1.5
stripInternal移除内部声明不输出 JSDoc 中包含 @internal 的类型声明(隐藏内部 API)。false1.8

4. JavaScript 支持(JavaScript Support)

控制 TypeScript 对 JavaScript 文件的处理能力(如类型检查、包含 JS 文件)。

配置字段中文含义功能描述默认值生效版本
allowJs允许 JS 文件将 JS 文件纳入项目编译范围(配合 checkJs 可对 JS 进行类型检查)。false1.8
checkJs检查 JS 文件对 JS 文件进行类型检查(需配合 allowJs: true),报错 JS 中的类型问题。false1.8
maxNodeModuleJsDepthNode 模块 JS 检查深度检查 node_modules 中 JS 文件的最大目录深度(仅 allowJs: true 时生效)。0(不检查)2.0

5. 编辑器支持(Editor Support)

优化编辑器(如 VS Code)对 TypeScript 项目的支持,如插件、性能限制。

配置字段中文含义功能描述默认值生效版本
disableSizeLimit禁用大小限制取消 TypeScript 对项目大小的限制(适合超大型项目)。false-
plugins编辑器插件配置 TypeScript 语言服务插件(如 typescript-eslint、prettier)。[]-

6. 互操作约束(Interop Constraints)

控制不同模块系统(如 ESM、CommonJS)之间的互操作行为,避免兼容问题。

配置字段中文含义功能描述默认值生效版本
allowSyntheticDefaultImports允许合成默认导入允许对无默认导出的模块使用 import x from "module"(生成合成默认导入)。true(若 esModuleInterop: true);否则 false1.8
erasableSyntaxOnly仅可擦除语法仅保留可被擦除的 TypeScript 语法(如类型注解),不保留其他非标准语法。false5.0
esModuleInteropESM 与 CJS 互操作生成额外代码适配 ESM 导入 CommonJS 模块(自动开启 allowSyntheticDefaultImports)。false2.7
forceConsistentCasingInFileNames强制文件名大小写一致确保导入路径的大小写与实际文件一致(避免跨系统运行问题,如 Windows 不区分大小写)。false2.0
isolatedDeclarations隔离声明文件确保每个声明文件(.d.ts)可独立编译,不依赖其他声明文件。false5.0
isolatedModules隔离模块确保每个文件可独立转译(不依赖其他文件),适配 bundler(如 Babel、SWC)。false1.8
preserveSymlinks保留符号链接不将符号链接(symlink)解析为真实路径(与 Node.js --preserve-symlinks 一致)。false2.0
verbatimModuleSyntax原样保留模块语法不转换 / 省略非 “仅类型”(type-only)的导入导出,按 module 配置原样输出。false4.7

7. 向后兼容(Backwards Compatibility)

兼容旧版 TypeScript 或 JavaScript 代码,避免升级后报错。

配置字段中文含义功能描述默认值生效版本
charset文件编码指定输入文件的编码格式(如 utf8、utf16)。utf81.0
importsNotUsedAsValues未使用导入处理控制仅用于类型的导入(import type)的输出 / 检查行为:
- remove:移除未使用的类型导入;
- preserve:保留导入语句;
- error:未使用则报错。
remove3.8
keyofStringsOnlykeyof 仅字符串限制 keyof 操作符仅返回字符串类型(而非字符串 / 数字 / 符号,兼容旧代码)。false2.9
noImplicitUseStrict禁止隐式严格模式不在输出 JS 中添加 "use strict"(即使 alwaysStrict: true,用于兼容旧环境)。false1.7
noStrictGenericChecks宽松泛型检查关闭严格的泛型类型检查(兼容旧版 TS 中不严格的泛型匹配)。false2.3
out旧版输出路径(已废弃)同 outFile,仅用于兼容旧配置。""1.0
preserveValueImports保留未使用值导入保留未使用的非类型导入(避免 bundler 误删有副作用的导入)。false3.8
suppressExcessPropertyErrors抑制多余属性错误不报错对象字面量的多余属性(如 { a: 1, b: 2 } 赋值给 { a: number })。false1.6
suppressImplicitAnyIndexErrors抑制隐式 any 索引错误不报错通过索引访问隐式 any 类型的属性(如 obj[key] 中 obj 为 any)。false1.8

8. 语言与环境(Language and Environment)

指定 TypeScript 支持的语言特性和目标运行时环境(如 ES 版本、DOM API)。

配置字段中文含义功能描述默认值生效版本
emitDecoratorMetadata生成装饰器元数据为装饰器声明生成设计时类型元数据(如 Reflect.getMetadata 可访问),需配合 experimentalDecorators: true。false1.5
experimentalDecorators启用实验性装饰器支持旧版实验性装饰器语法(如类装饰器、属性装饰器)。false1.5
jsxJSX 处理模式指定 JSX 代码的生成方式:
- preserve:保留 JSX(用于 React 17+ 或自定义 transpiler);
- react:生成 React.createElement;
- react-jsx:生成 jsx 函数(React 17+ 推荐)。
preserve1.6
jsxFactoryJSX 工厂函数指定生成 JSX 时使用的工厂函数(如 React.createElement 或 h,仅 jsx: react 时生效)。"React.createElement"1.6
jsxFragmentFactoryJSX 片段工厂函数指定生成 JSX 片段(<>)时使用的函数(如 React.Fragment,仅 jsx: react 时生效)。"React.Fragment"4.0
jsxImportSourceJSX 导入源指定导入 JSX 工厂函数的模块(如 import { jsx } from "preact/jsx-runtime",仅 jsx: react-jsx* 时生效)。"react"4.1
lib内置库声明指定项目依赖的内置库声明文件(如 ES2020、DOM、WebWorker),控制可用的 API 类型。随 target 自动匹配(如 target: ES2015 对应 ES2015、DOM 等)1.5
libReplacement库声明替换替换默认的库声明文件(如用自定义 DOM 声明替换默认 lib.dom.d.ts)。{}5.0
moduleDetection模块检测方式控制如何检测文件是否为模块:
- auto:自动检测(有 import/export 则为模块);
- force:强制所有文件视为模块;
- legacy:旧版检测逻辑。
auto4.7
noLib禁用内置库不包含任何内置库声明文件(包括默认 lib.d.ts),需手动提供所有类型声明。false1.5
reactNamespaceReact 命名空间指定调用 createElement 时的命名空间(如 React,仅 jsx: react 时生效)。"React"1.6
target目标 JS 版本指定生成 JS 的目标 ES 版本(如 ES5、ES2020、ESNext),影响语法降级程度。ES3(旧版)/ ES5(新版)1.0
useDefineForClassFields类字段用 define生成符合 ES 标准的类字段(使用 Object.defineProperty),而非赋值语法。false(若 target < ES2022);否则 true3.7

9. 编译器诊断(Compiler Diagnostics)

控制编译器输出的诊断信息(如错误详情、文件列表),用于调试编译问题。

配置字段中文含义功能描述默认值生效版本
diagnostics输出诊断信息编译时输出详细的诊断信息(如类型检查时间、文件数量)。false2.0
explainFiles解释文件包含原因输出每个文件被纳入编译的原因(如通过 include、import 或 reference)。false2.0
extendedDiagnostics扩展诊断信息输出更详细的诊断信息(如内存使用、模块解析过程)。false2.3
generateCpuProfile生成 CPU 分析报告编译时生成 CPU 分析报告(.cpuprofile 文件),用于优化编译性能。""(不生成)3.0
generateTrace生成编译追踪生成编译过程的追踪文件(.trace),用于调试编译错误或性能问题。""(不生成)4.0
listEmittedFiles列出输出文件编译后列出所有生成的输出文件(JS/.d.ts/ 源映射)。false1.5
listFiles列出输入文件编译前列出所有纳入编译的输入文件(TS/JS/.d.ts)。false1.5
noCheck禁止类型检查完全跳过类型检查,仅执行文件转译(不推荐,用于快速编译)。false3.7
traceResolution追踪模块解析输出模块解析的详细过程(如查找路径、匹配结果),用于调试模块找不到问题。false1.6

10. 项目配置(Projects)

控制多项目引用(references)相关的编译行为,优化多项目构建效率。

配置字段中文含义功能描述默认值生效版本
composite复合项目启用复合项目模式(允许被其他项目引用),需配合 rootDir、outDir 使用。false3.0
disableReferencedProjectLoad禁用引用项目加载减少自动加载的引用项目数量,提升编辑性能(适合超大型多项目)。false3.0
disableSolutionSearching禁用解决方案搜索编辑时不参与多项目引用检查,提升大型解决方案的编辑性能。false3.0
disableSourceOfProjectReferenceRedirect禁用源文件重定向引用复合项目时,优先使用声明文件(.d.ts)而非源文件(TS)。false3.0
incremental增量编译生成 .tsbuildinfo 文件缓存编译状态,仅重新编译修改的文件,提升编译速度。false3.4
tsBuildInfoFile增量编译文件路径指定 .tsbuildinfo 文件的路径(存储增量编译缓存)。./.tsbuildinfo3.4

11. 输出格式化(Output Formatting)

控制编译器输出信息(如错误提示、日志)的格式,提升可读性。

配置字段中文含义功能描述默认值生效版本
noErrorTruncation不截断错误信息完整输出错误信息(默认会截断过长的错误描述)。false2.1
preserveWatchOutput保留监听输出tsc --watch 模式下,不清除之前的输出日志,便于查看历史编译结果。false2.7
pretty美化输出格式格式化编译器输出(如错误信息着色、缩进),提升可读性。true(终端环境);false(非终端)2.5

12. 完整性检查(Completeness)

控制是否跳过类型声明文件的检查,优化编译速度(代价是可能遗漏声明文件错误)。

配置字段中文含义功能描述默认值生效版本
skipDefaultLibCheck跳过默认库检查跳过 TypeScript 自带的默认库声明文件(如 lib.es2015.d.ts)的类型检查。false2.0
skipLibCheck跳过所有库检查跳过所有 .d.ts 文件(包括默认库和第三方依赖)的类型检查,大幅提升编译速度。false2.0

13. 命令行与监听选项(Command Line & Watch Options)

控制 tsc 命令行(如 tsc --watch)的行为,优化开发体验。

配置字段中文含义功能描述默认值生效版本
assumeChangesOnlyAffectDirectDependencies假设变更仅影响直接依赖tsc --watch 模式下,仅重新编译变更文件的直接依赖,提升监听性能。false3.8
watchFile文件监听方式指定监听文件变化的方式(如 useFsEvents、dynamicPriorityPolling),适配不同系统。随系统自动匹配2.7
watchDirectory目录监听方式指定监听目录变化的方式(如 useFsEvents、fixedPollingInterval)。随系统自动匹配2.7
fallbackPolling降级轮询方式当文件系统监听不可用时,使用的轮询方式(如 interval、dynamicPriority)。dynamicPriority2.7
synchronousWatchDirectory同步目录监听同步处理目录监听事件(避免异步导致的竞态问题,适合特定场景)。false2.7
excludeDirectories监听排除目录tsc --watch 模式下,不监听的目录(如 node_modules)。["node_modules", "bower_components"]2.7
excludeFiles监听排除文件tsc --watch 模式下,不监听的文件(如日志文件)。[]2.7

14. 类型获取(typeAcquisition)

控制 TypeScript 自动获取 JavaScript 项目的类型声明文件(如从 @types 下载)。

配置字段中文含义功能描述默认值生效版本
enable启用自动类型获取自动为 JS 文件获取对应的 @types 类型声明(如为 jquery.js 获取 @types/jquery)。false(JS 项目);true(TS 项目)2.1
include包含类型获取文件指定自动获取类型的文件 / 模式(如 ["jquery", "react"])。[]2.1
exclude排除类型获取文件指定不自动获取类型的文件 / 模式(如 ["lodash"])。[]2.1
disableFilenameBasedTypeAcquisition禁用文件名类型获取不根据文件名自动匹配类型声明(如 vue.js 不自动获取 @types/vue)。false3.3

四、常见场景配置示例

1. 现代 Node.js 项目(ESM/CJS 兼容)

{
  "compilerOptions": {
    "target": "ES2022",                // 目标 ES 版本
    "module": "nodenext",              // 适配现代 Node.js 模块系统
    "moduleResolution": "nodenext",    // 匹配模块系统的解析策略
    "outDir": "./dist",                // 输出目录
    "rootDir": "./src",                // 源代码根目录
    "strict": true,                    // 开启所有严格检查
    "esModuleInterop": true,           // ESM 与 CJS 互操作
    "skipLibCheck": true,              // 跳过库声明检查(提升速度)
    "forceConsistentCasingInFileNames": true, // 强制文件名大小写一致
    "resolveJsonModule": true          // 支持导入 JSON
  },
  "include": ["src/**/*"],
  "exclude": ["node_modules", "src/**/*.test.ts"]
}

2. React 前端项目(Vite/Rollup bundler)

{
  "compilerOptions": {
    "target": "ES2020",                // 适配现代浏览器
    "module": "esnext",                // 保留 ESM 语法(bundler 处理)
    "moduleResolution": "bundler",     // 适配 bundler 解析策略
    "jsx": "react-jsx",                // React 17+ JSX 模式
    "jsxImportSource": "react",        // JSX 工厂函数导入源
    "outDir": "./dist",                // 输出目录
    "rootDir": "./src",                // 源代码根目录
    "strict": true,                    // 开启严格检查
    "skipLibCheck": true,              // 跳过库声明检查
    "allowArbitraryExtensions": true,  // 允许导入 CSS/SVG 等文件
    "resolveJsonModule": true,         // 支持 JSON 导入
    "isolatedModules": true            // 确保文件可独立转译(bundler 要求)
  },
  "include": ["src/**/*"],
  "exclude": ["node_modules"]
}

3. 多项目引用(Monorepo)

// 根项目 tsconfig.json
{
  "files": [],                         // 根项目无源代码
  "references": [                     // 引用子项目
    { "path": "./packages/utils" },    // 工具库子项目
    { "path": "./packages/components"  // UI组件子项目
  ]
}
// 子项目 packages/utils/tsconfig.json
{
  "compilerOptions": {
    "composite": true,                 // 启用复合项目(允许被引用)
    "target": "ES2020",
    "module": "esnext",
    "outDir": "./dist",
    "rootDir": "./src",
    "declaration": true,               // 生成类型声明(供其他项目使用)
    "strict": true,
    "skipLibCheck": true
  },
  "include": ["src/**/*"]
}

五、总结

TSConfig 配置覆盖了 TypeScript 项目的全生命周期需求,从文件范围控制到类型检查、模块处理、输出优化,再到多项目管理。核心建议:

  1. 优先开启 strict: true:生产环境项目建议开启所有严格检查,减少运行时错误;
  1. 适配目标运行时:根据项目场景(Node.js/ 浏览器 /bundler)选择 module、moduleResolution、target 等核心配置;
  1. 优化编译速度:大型项目可开启 incremental、skipLibCheck、composite 等配置,提升编译和编辑效率;
  1. 多项目拆分:复杂项目通过 references 拆分为子项目,实现隔离编译和依赖复用。

如需更细节的配置说明,可参考 TypeScript 官方文档:www.typescriptlang.org/tsconfig/