tsconfig.json 最小必需配置是 "compilerOptions" 和 "include"(或 "files"),其中 "strict": true 不可省略,否则失去 TypeScript 核心类型检查能力;"outDir" 和 "baseUrl" 需显式设置才能启用编译输出与路径别名。

tsconfig.json 必须存在的最小配置项
没有 tsconfig.json,VSCode 就不会启用 TypeScript 的项目级检查和智能提示,哪怕文件后缀是 .ts。它不是可选的“高级设置”,而是 TypeScript 项目的启动开关。
最简可用配置只需两项:"compilerOptions" 和 "include"(或 "files"):
{
"compilerOptions": {
"target": "ES2020",
"module": "commonjs",
"lib": ["ES2020", "DOM"],
"strict": true,
"skipLibCheck": true,
"esModuleInterop": true,
"forceConsistentCasingInFileNames": true
},
"include": ["src/**/*"]
}
-
"target"建议设为ES2020或更高:太低(如ES5)会抹掉类型信息、生成冗余代码;太高(如ESNext)可能在旧环境运行报错 -
"include"要明确覆盖源码路径,["src/**/*"]比["**/*.ts"]更安全——后者会误扫node_modules或构建产物 - 漏掉
"strict": true是常见疏忽:它开启全部严格检查(noImplicitAny、strictNullChecks等),关掉等于放弃 TypeScript 最核心价值
tsc 编译命令默认不生成 JS 文件?
直接运行 tsc 命令却没看到输出的 .js 文件,大概率是因为没开 "outDir" 或 "declaration" 等输出相关选项——TypeScript 编译器默认只做类型检查,不做文件落地。
要让 tsc 真正生成可执行代码,必须显式指定输出行为:
- 加
"outDir": "./dist":所有编译结果(.js、.d.ts)写入该目录,且自动按源码目录结构组织 - 加
"rootDir": "./src":配合outDir明确源码根路径,避免tsc把node_modules或配置文件也当源码处理 - 不要依赖
"outFile":它只适用于单文件打包(amd或system模块),现代项目基本用不上,还容易和outDir冲突
验证是否生效:终端执行 tsc --noEmit false(强制开启输出),再看 dist/ 下是否有对应文件。
VSCode 不识别 tsconfig.json 中的路径别名?
写了 "paths" 别名(比如 "@/*": ["src/*"]),但 VSCode 里 Ctrl+点击跳转失败、路径补全不出现,问题不在 Webpack 或 Vite,而在 VSCode 自身的 TS 服务没加载到该配置。
关键点:VSCode 默认使用工作区内置的 TypeScript 版本(通常较新),但它读取 tsconfig.json 时,对 "baseUrl" 和 "paths" 的解析依赖于 "baseUrl" 是否存在且合法:
- 必须同时声明
"baseUrl": "."(或"./"),否则"paths"会被完全忽略 -
"baseUrl"值必须是相对路径(不能是src或绝对路径),且相对于tsconfig.json所在目录解析 - 改完配置后,VSCode 右下角会出现 “TypeScript reload required”,必须点击或手动触发
Restart TS Server(Ctrl+Shift+P → 输入 “TypeScript: Restart TS Server”)
错误示例:"baseUrl": "src" 看似合理,但会导致路径解析失败——它实际被解释为 tsconfig.json 目录/src,而非你想要的 src/ 根目录。
为什么保存时没自动编译?tsc --watch 不是实时的
VSCode 本身不监听文件变化并调用 tsc,所谓“保存即编译”其实是靠外部工具(如 tsc --watch 或构建脚本)实现的,而 --watch 模式有隐藏限制:
-
tsc --watch默认只监视tsconfig.json所在目录及子目录,如果tsconfig.json放在项目根,但源码在packages/foo/src,它可能根本不会触发编译 - 修改
tsconfig.json后,--watch不会自动重载配置,必须手动终止再重启 - VSCode 的保存操作不会触发 shell 命令,想“保存即编译”,得配
tasks.json+ 文件关联,或用插件(如Auto Build Typescript),但更推荐统一用npm run build:watch
真正稳定的做法:在 package.json 里定义 "build:watch": "tsc -w",然后终端里跑它;VSCode 只负责编辑和类型提示,编译交给独立进程。
复杂点在于:多人协作时,tsconfig.json 的 "include"、"exclude" 和 "baseUrl" 必须严格对齐,差一个点号或斜杠,路径别名就失效,且错误不报红——它只是静默降级为相对导入。


















