首先配置tasks.json文件定义构建任务，再通过快捷键Ctrl+Shift+B或命令面板运行；例如用npm run build或tsc编译，任务输出显示在终端面板，提升开发效率。

在 vscode 中运行构建任务，需要先配置 tasks.json 文件，然后通过命令或快捷键触发任务。整个过程不复杂，关键是正确设置任务内容。

创建 tasks.json 配置文件

VSCode 使用 tasks.json 来定义可运行的构建任务。你需要把它放在项目的 .vscode 文件夹中。

操作步骤：

• 打开你的项目根目录
• 按下 Ctrl + Shift + P 打开命令面板
• 输入并选择 Tasks: Configure Task
• 选择 Create tasks.json file from template，然后选一个合适的模板，比如 npm 或 Others

VSCode 会自动生成 .vscode/tasks.json 文件。

编写构建任务示例

假设你想运行一个简单的 npm 构建命令（如 npm run build），可以这样写：

tasks.json 示例内容：

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

其中 group.kind: “build” 表示这是一个构建任务，可使用默认构建快捷键触发。

运行构建任务

配置完成后，有几种方式可以运行任务：

一览运营宝

一览“运营宝”是一款搭载AIGC的视频创作赋能及变现工具，由深耕视频行业18年的一览科技研发推出。

41

查看详情

• 快捷键运行：按下 Ctrl + Shift + B，执行默认的构建任务
• 命令面板运行：按 Ctrl + Shift + P，输入 Tasks: Run Build Task
• 手动选择任务：输入 Tasks: Run Task，然后从列表中选择你要运行的任务

任务输出会显示在底部的集成终端面板中，方便查看结果和错误信息。

自定义其他构建命令

除了 npm，你也可以运行任意命令，比如编译 typescript、调用 python 脚本等。

例如运行 tsc 编译：

{   "label": "tsc compile",   "type": "shell",   "command": "tsc",   "args": ["-p", "."],   "group": "build" } 

只要确保相关工具已安装且在系统路径中可用即可。

基本上就这些。配置一次后，每次按 Ctrl + Shift + B 就能快速构建，效率提升明显。