vscode不自动编译typescript，必须安装本地tsc、配置含outdir和rootdir的tsconfig.json，并通过tasks.json设置isbackground:true的tsc --watch任务才能实现保存自动编译。
VSCode 本身不运行 TypeScript，也不自动编译它——你看到的“没报错”只是编辑器在做类型检查，.js 文件根本不会凭空生成。必须手动配 tsc、tsconfig.json 和 tasks.json，缺一不可。
确认 tsc 命令在终端可用
这是所有后续步骤的前提。VSCode 自带 TS 语言服务，但 tsc 是独立命令行工具，不装就编译不了。
- 推荐本地安装：
npm install --save-dev typescript（避免全局版本和项目版本冲突） - 装完后在集成终端（
Ctrl+`）执行：npx tsc -v，能看到类似5.4.5的输出才算成功 - 如果只装了全局
tsc，但项目里typescript@5.0，而全局是4.9，某些新配置项（如moduleResolution: "bundler"）会被静默忽略 - Windows 用户装完建议重启 VSCode，确保 PATH 刷新生效
tsconfig.json 必须存在且关键字段不能少
没有它，tsc 只会单文件转换，不读任何配置；有但写错或含注释，会导致监听失败或输出到错目录。
- 运行
npx tsc --init生成基础文件，然后手动改两处核心： -
"outDir": "./dist"：JS 输出目录，路径不存在会自动创建 -
"rootDir": "./src"：明确源码起始位置，否则tsc可能误扫node_modules或配置文件 - 删掉所有以
//开头的行——JSON 不支持注释，tsc遇到直接退出并报错 - 常见陷阱：
"noEmit": true是默认关闭的，但如果手抖开了，tsc就完全不输出 JS，还假装编译成功
用 tasks.json 绑定 Ctrl+Shift+B 启动监听
手动敲 npx tsc --watch 太原始；VSCode 的任务系统能后台持续监听，但必须配对 isBackground 和 problemMatcher 才能真正“自动”。
- 按
Ctrl+Shift+P→ 输入 “Tasks: Configure Task” → 选 “Create tasks.json from template” → “Others” - 替换内容为以下结构，重点核对
command、args和isBackground：
{
"version": "2.0.0",
"tasks": [
{
"label": "tsc: watch",
"type": "shell",
"command": "npx tsc",
"args": ["--watch"],
"group": "build",
"isBackground": true,
"problemMatcher": ["$tsc-watch"]
}
]
}
-
isBackground: true缺了它，任务执行完就退出，无法监听文件变化 -
problemMatcher: ["$tsc-watch"]决定错误能不能标红、能不能 F8 跳转；没它，报错只堆在终端里，编辑器无感知 - 配完后按
Ctrl+Shift+B→ 选 “tsc: watch”，终端应输出Found 0 errors. Watching for file changes.
保存后没生成 .js？先查这三处
现象是“文件改了、保存了、终端也显示 File change detected，但 dist 里还是空的”，大概率不是配置逻辑问题，而是路径或覆盖范围出错。
-
tsconfig.json里"outDir"路径写错（比如写成"./build"却忘了建对应目录，或拼错字母） -
"include"没覆盖你的.ts文件（例如你把文件放在src/下，但tsconfig.json没写"include": ["src/**/*"]） -
"rootDir"和"outDir"路径重叠（比如都设成"./src"），tsc会把刚生成的.js当源码再编译一次，导致循环错误甚至卡死
最稳的验证方式：关掉所有 VSCode 窗口，在终端里直接跑 npx tsc --noEmitOnError --watch，看报错是否清晰——编辑器封装有时会掩盖真实路径问题。
