用 VS Code 的 tasks.json 把常用命令变成一键操作

为什么值得写一个 tasks.json

改完代码要切到终端敲 npm run build，再敲测试，再跑格式化……一天重复二三十次。VS Code 的 tasks.json 把这些命令登记成「任务」，用 Ctrl+Shift+B 或命令面板的 Tasks: Run Task 一键触发。好处是命令、参数、工作目录都集中在一个文件里，换机器或换同事只要改一次路径，不用靠记忆。

最小可用的写法

在项目根目录建 .vscode/tasks.json，最小配置只有 version 和 tasks 两块：

{ "version": "2.0.0", "tasks": [ { "label": "build", "type": "shell", "command": "npm run build", "group": { "kind": "build", "isDefault": true } } ] }

label 是任务名，type: shell 表示交给系统 shell 执行；group.kind 写 build 并加 isDefault 后，Ctrl+Shift+B 直接跑它，不再弹选择框。

四个最常用的字段

cwd：命令在哪个目录执行，默认是工作区根目录，前端项目常需要指到子包。args：把参数写成数组，例如 ["--watch"]，比在 command 里拼字符串安全，不用操心引号转义。presentation：控制输出面板行为，reveal 选 always 或 silent，panel 选 shared 或 dedicated，clear 让每次运行前清屏。problemMatcher：把编译器的报错解析成 Problems 面板条目，点一下就跳到出错行，写入 $tsc、$eslint-stylish 这类内置名字即可。

把多个任务串起来

一个任务依赖另一个任务，用 dependsOn：先 clean 再 build，就把 clean 写进 build 的 dependsOn 数组；dependsOrder: sequence 保证按顺序跑，默认的 parallel 会并行开跑，容易互相踩文件。想一次跑多条互不相关的命令，用 compound 定义组合任务。调试配置里的 preLaunchTask 也能挂任务，实现「调试前自动编译」。

跨平台与变量

路径不要写死，用 ${workspaceFolder}、${file}、${fileDirname} 这些变量，Windows 和 macOS 都能跑。${input:名字} 可以配 inputs 做运行时选择，比如让用户挑环境。Windows 下如果命令里有重定向或管道，shell 可能不是 bash，可在任务里加 "windows": { "command": "cmd", "args": ["/c", "..."] }，或者直接把 type 改成 process 绕开 shell 解析。

排错：三个常见坑

一、任务显示失败但终端没有报错：去看「Tasks: 显示输出」而不是集成终端，错误常被 shell 吞掉。二、command not found：多半是 cwd 不对，或该命令不在系统 PATH 里，把绝对路径或 npx 写进 command 试一次。三、任务一直挂着不结束：后台任务（比如 watch）需要配 isBackground 和 problemMatcher 的 background 段，否则 VS Code 无法判断它「已启动」。

把 build、test、lint、format 四条写进 tasks.json，之后每天就是 Ctrl+Shift+B 加命令面板两步。配置本身也是一份项目文档：新人打开仓库就知道该怎么构建和验证。