vscode任务系统可 自动化 编译、测试等流程:一、通过 tasks.json 自定义命令;二、自动识别 package.json脚本生成任务;三、用 dependsOn 配置多任务依赖链;四、绑定快捷键快速触发任务。
如果您在使用 visual studio code 进行开发时,希望将编译、测试、打包等重复性操作交由编辑器自动执行,则 vscode 的任务(tasks)系统可直接集成命令行 工具 并触发预定义流程。以下是配置与运行任务的具体方式:
本文运行环境:macBook air,macOS Sequoia。
一、创建自定义任务文件
VSCode 通过 .vscode/tasks.json 文件定义任务,该文件位于工作区根目录下,用于声明可执行的命令及其参数。编辑此文件可精确控制输入输出、执行路径和前置依赖。
1、在 VSCode 中打开您的项目文件夹。
2、按下 Cmd + Shift + P(Mac)或 Ctrl + Shift + P(windows/linux),输入 Tasks: Configure Task,回车。
3、选择 Create tasks.json file from template,然后选择 Others 模板。
4、在生成的 JSON 中,修改 label 字段为任务名称,将 command 字段设为要运行的可执行程序,例如 tsc 或 npm run build。
二、从终端命令快速生成任务
当项目中已存在可运行的脚本(如 package.json 中的 scripts),VSCode 可自动识别并 封装 为任务,无需手动编写 JSON 结构,适用于 npm/yarn/pnpm 等包管理器场景。
1、确保项目根目录下存在 package.json 文件且包含 scripts 字段。
2、按下 Cmd + Shift + P,输入 Tasks: Run Task,回车。
3、在列表中选择 Detect Task,VSCode 将扫描 scripts 并列出所有可用条目。
4、选择某一项(如 test),VSCode 自动创建对应任务并保存至 .vscode/tasks.json。
三、配置多任务依赖链
某些构建流程需按顺序执行多个步骤(例如先清理再编译),VSCode 支持通过 dependsOn 字段定义任务之间的执行依赖关系,确保前序任务成功完成后再启动后续任务。
1、在 .vscode/tasks.json 中为首个任务添加 “group”: “build” 字段以标记其类别。
2、为第二个任务添加 “dependsOn”: [“clean”],其中 clean 是第一个任务的 label 值。
3、确保每个被依赖的任务均设置 “problemMatcher”: [] 或匹配器以支持错误捕获。
4、运行主任务时,VSCode 将自动检测并依次执行全部依赖项。
四、绑定快捷键触发特定任务
为避免频繁调出命令面板,可通过键盘快捷键直接运行常用任务,提升高频操作效率。该配置独立于 tasks.json,存储于用户或工作区的 keybindings.json 中。
1、按下 Cmd + Shift + P,输入 Preferences: Open Keyboard Shortcuts (JSON),回车。
2、在数组中添加新 对象,设置 “key”: “cmd+alt+b”(Mac)或 “key”: “ctrl+alt+b”(windows/Linux)。
3、将 “command”: “workbench.action.terminal.runActiveFile” 替换为 “command”: “workbench.action.terminal.runSelectedText”。
4、添加 “args”: {“task”: “build”},其中 build 是目标任务的 label 值。