VSCode本身不支持同时运行两个程序,本质是启动多个独立进程:终端分栏最直接(Ctrl+Shift+`后Split Terminal),tasks.json需设"isBackground":true和"parallel":true,并行任务推荐concurrently工具统一管理。

VSCode 本身不“同时运行”两个程序,它只启动你指定的进程;所谓并发,本质是用隔离的终端实例或任务配置让它们互不干扰地跑起来。
终端分栏是最稳、最直观的并发方式
不用改配置、不碰 tasks.json,按快捷键就能立刻获得两个独立 shell:
- 按
Ctrl+Shift+`(Windows/Linux)或Cmd+Shift+`(macOS)打开第一个终端 - 右键该终端标签 → 选 Split Terminal(或按
Ctrl+Shift+5),得到左右/上下并排的两个终端 - 左栏执行
npm run dev(前端),右栏执行npm run server(Node.js 后端) - 每个分栏是全新 shell 进程,
cwd默认继承自被右键的那个终端——如果之前cd过子目录,新分栏也会进错路径,务必先pwd确认,必要时手动cd到对应目录
tasks.json 配置并行任务但容易卡住
适合需要一键触发、路径固定、且希望和 VSCode 任务系统深度集成的场景。但默认行为极易踩坑:
- 必须为每个任务设
"isBackground": true,否则第二个任务会等第一个退出才启动 - 靠
"dependsOn": ["frontend", "backend"]+"runOptions": { "parallel": true }实现并发,不是写在同一个command里用&&或& -
"options": { "cwd": "${workspaceFolder}/frontend" }必须显式写,否则两个任务都在项目根目录下跑,package.json找不到 - 所有任务默认输出挤在同一个终端面板里,加
"presentation": { "panel": "dedicated" }才能各占一个独立面板 - 某个任务崩溃退出,其他任务不会自动终止——VSCode 不做进程守卫
concurrently 是复杂项目的实际选择
当你要稳定管理多个长期运行的进程(比如 dev server + lint watch + mock server),concurrently 比原生机制更可靠:
- 先安装:
npm install --save-dev concurrently - 在
package.json中加脚本:"dev:all": "concurrently \"npm run dev\" \"npm run server\"" - 它会为每个命令分配独立子进程、彩色区分日志、任一崩溃可配置是否终止全部(默认不终止)
- 比
npm run dev & npm run server安全:后者在第一个进程退出时,shell 可能直接 kill 掉第二个 - VSCode 里可以直接在任意终端运行这个脚本,无需额外配置 tasks.json
端口冲突和进程残留是并发时最常被忽略的点
两个服务都默认用 3000 或 5000?一个没关干净,另一个就起不来:
- 错误现象:
OSError: [Errno 98] Address already in use—— 不是代码问题,是端口被占 - 别依赖关闭终端标签页来杀进程:带
app.listen()、while True:或 WebSocket 的脚本,必须手动Ctrl+C - 残留检查:
ps aux | grep -E "(node|npm)"(macOS/Linux)或任务管理器搜node.exe(Windows) - 调试时更要小心:VSCode 的 Debug 模式和终端运行是两套进程,
launch.json启的 Node 服务和你在终端跑的可能同时监听同一端口
前端入门到VUE实战笔记:立即使用
在学习笔记中,你将探索 前端 的入门与实战技巧!











