VS Code 中 TypeScript 不编译是因为缺少 tsc 编译器而非插件；需安装 typescript（推荐本地 npm install --save-dev typescript），配置 tsconfig.json，并通过 tasks.json 设置 tsc 监听任务实现保存自动编译。
VS Code 里 TypeScript 不报错但不编译，缺的是 tsc 而不是插件
VS Code 自带 TypeScript 语言服务（语法检查、跳转、补全），但默认**不会自动编译 .ts 文件为 .js**。你看到的“类型检查正常”只是编辑器在用内置 TS Server 做静态分析，和编译完全无关。真正触发编译需要外部命令 tsc —— 它来自 TypeScript 编译器包，必须显式安装。
- 全局安装：
npm install -g typescript（之后终端能直接运行tsc） - 项目本地安装更推荐：
npm install --save-dev typescript，然后通过npx tsc调用 - 装完后在终端执行
tsc -v，确认输出版本号（如5.4.5），否则后续所有编译步骤都无效
tsconfig.json 是编译行为的唯一控制中心
没有 tsconfig.json，tsc 只会做最基础的单文件转换（且忽略所有配置），无法处理模块、路径别名、JSX、目标环境等关键逻辑。必须手动初始化或创建它。
- 在项目根目录运行
npx tsc --init，生成默认配置文件 - 关键字段要手动改：比如
"outDir": "./dist"指定输出目录，"rootDir": "./src"声明源码位置，"target": "ES2020"控制生成 JS 版本 - 如果项目含 JSX，必须设
"jsx": "react-jsx"；用 Node.js 后端则建议"module": "commonjs" - 删掉
//开头的注释行——tsc不认注释，会导致解析失败
{
"compilerOptions": {
"target": "ES2020",
"module": "commonjs",
"lib": ["ES2020", "DOM"],
"outDir": "./dist",
"rootDir": "./src",
"strict": true,
"esModuleInterop": true,
"skipLibCheck": true,
"forceConsistentCasingInFileNames": true
},
"include": ["src/**/*"]
}
用 tasks.json 把 tsc 接进 VS Code 快捷键
不想每次打开终端敲 npx tsc？VS Code 的任务系统可以绑定到快捷键（如 Ctrl+Shift+B），但前提是正确配置 .vscode/tasks.json。
- 按
Ctrl+Shift+P→ 输入 “Tasks: Configure Task” → 选 “Create tasks.json from template” → 选 “Others” - 替换内容为以下结构，重点看
command和args：本地安装就用npx tsc，全局安装可直接写tsc -
isBackground设为true才能支持监听模式（--watch），否则每次编译完就退出
{
"version": "2.0.0",
"tasks": [
{
"label": "tsc: watch",
"type": "shell",
"command": "npx tsc",
"args": ["--watch"],
"group": "build",
"isBackground": true,
"problemMatcher": ["$tsc-watch"]
}
]
}
配好后按 Ctrl+Shift+B，选择 “tsc: watch”，终端就会启动监听——保存 .ts 文件自动重新编译。
常见报错直接对应配置项
编译失败时，错误信息里的关键词基本能定位到 tsconfig.json 的哪个字段没设对：
-
Cannot find module 'xxx'→ 检查"baseUrl"和"paths"是否配了路径映射，或"moduleResolution"是否为"node" -
JSX element type does not have any construct or call signatures→"jsx"没设，或"lib"缺"DOM" - 输出 JS 里还有
import/export未被转换 →"module"值不匹配运行环境（浏览器要用"ESNext"，Node 用"commonjs"） -
error TS5055: Cannot write file ... because it would overwrite input file→"outDir"和"rootDir"路径重叠，比如都设成了"./src"
编译是纯命令行行为，和 VS Code 主题、插件开关、设置里的 “TypeScript > Suggest: Auto Imports” 都无关。只要 tsc 能在终端跑通，VS Code 里的编译任务就大概率能跑通。
