vscode 通过 tasks.json 配置任务系统可自动化重复性工作，提升效率。1. tasks.json 是核心配置文件，通过 label、command、group 等字段定义任务；2. 可实现保存自动格式化代码，结合 prettier 与 settings.json 设置实现自动化；3. 支持一键启动开发环境，通过组合命令或依赖任务顺序执行构建与运行操作；4. 可通过 options 与 presentation 设置优化任务输出查看体验。
VSCode 本身就是一个强大的代码编辑器，但如果你还没用它来自动化重复任务，那你可能正在浪费时间。配置 VSCode 的任务系统可以帮你自动执行构建、测试、格式化代码等常见流程，省时又高效。
基本结构：从 tasks.json 开始
VSCode 的任务配置文件是 .vscode/tasks.json。你可以通过菜单 “终端 > 运行任务” 或快捷键 Ctrl+Shift+P 输入“任务”来创建或运行任务。
一个最简单的任务结构如下：
{
"version": "2.0.0",
"tasks": [
{
"label": "打印当前目录",
"type": "shell",
"command": "pwd",
"group": {
"kind": "build",
"isDefault": true
},
"problemMatcher": ["$tsc"]
}
]
}-
label是你给任务起的名字； -
command是要执行的命令； -
group决定这个任务属于哪个类别，比如 build（构建）或 test（测试），并可设为默认； -
problemMatcher可选，用于识别输出中的错误信息。
实用场景一：保存自动格式化代码
如果你希望每次保存文件时都自动格式化代码，可以用 format document 结合自定义任务的方式实现。
- 安装合适的格式化工具，比如 Prettier；
- 在设置中启用“保存时格式化”；
- 如果需要在格式化前执行其他操作（如 lint 检查），可以在 tasks.json 中添加任务，并绑定到保存钩子上。
例如：
{
"label": "格式化并保存",
"type": "shell",
"command": "prettier --write ${file}",
"problemMatcher": []
}然后在 settings.json 中加入：
"editor.codeActionsOnSave": {
"source.fixAll.eslint": true
}这样，在保存文件时就会自动触发格式化和修复操作。
实用场景二：一键启动开发环境
很多项目都有多个启动步骤，比如先编译 TypeScript，再运行服务。这些都可以写进任务里，一键搞定。
举个例子，你的项目结构可能是这样的：
- 编译 TS 到 dist 目录
- 然后运行 node dist/index.js
对应的任务配置如下：
{
"label": "启动开发服务器",
"type": "shell",
"command": "npm run build && node dist/index.js",
"group": {
"kind": "build",
"isDefault": true
},
"problemMatcher": ["$tsc"]
}或者也可以拆成两个任务，先 build，再 run：
[
{
"label": "Build TS",
"type": "shell",
"command": "tsc"
},
{
"label": "Run Server",
"type": "shell",
"command": "node dist/index.js",
"dependsOn": ["Build TS"],
"group": {
"kind": "build",
"isDefault": true
}
}
]使用 dependsOn 可以让任务之间有依赖关系，顺序执行。
小技巧：调试任务输出更清晰
有时候任务执行太快你看不清输出内容，这时候可以加个 options 设置工作目录和 shell 类型：
"options": {
"cwd": "${workspaceFolder}"
},
"presentation": {
"echo": true,
"reveal": "always",
"focus": false,
"panel": "shared"
}-
cwd指定当前工作目录； -
presentation控制终端行为，reveal: "always"让任务面板始终显示，方便查看日志。
基本上就这些。任务配置看起来简单，但真正用起来能节省大量手动操作时间。关键在于理解每个字段的作用，并根据自己的项目流程灵活组合。
