[Node] 如何使用 VSCode 调试 child_process
使用 VSCode 调试 Node.js 的时候，
遇到 child_process 中的断点，是跟不进去的。
（1）目录结构
打开 VSCode，并以 main 作为根目录，
（2）app.js
（3）child/process.js
（4）.vscode/launch.json
main 项目中按 F5 ，程序会停在 app.js 中的断点处，单步调试，
然后，调试进程就结束了。并不会跑到第 6 行的断点处，
child/process.js 中的断点，也跑不进去，
以上示例中，我们发现 VSCode 无法调试到 child_process 中。
也不确定 VSCode 未来是否会支持。
当前我们可以通过 Debug 的 Attach 方式，对 child_process 进行调试。
我们需要另一个 VSCode 实例来 Attach，两个 VSCode 一起使用。
main 项目的 .vscode/launch.json 启动 main/app.js
attach 项目的 .vscode/launch.json attach 到 child_process
目录结构分别如下，
为了能 attach 成功，我们需要同步修改 main/app.js 与 attach/.vscode/launch.json，
调试端口号可以任选，不一定的 9001 ，但应保持一致。
（1）main/app.js
（2）attach/.vscode/launch.json
（1）启动 main 项目
（2）debug attach 项目
attach 项目中按 F5 ，VSCode 会 attach 到已经启动的子进程上，
（1）main 项目，按 F5 启动调试
main 项目单步调试，
这时子进程已经启动了，切换到 attach 项目启动调试。
（2）attach 项目，按 F5 启动调试
attach 项目单步调试，
（3）main 项目 child.send
main 项目单步调试，断点直接跑到了 attach 项目中，
attach 项目单步调试，断点又回到 main 项目，
Debugging in Visual Studio Code
VSCode 调试
更全面的信息可以参考官方 调试手册 ，以下记录我用 VSCode 调试的一些经验。
想要在 VSCode 里调试，需要配置两个文件 tasks.json 和 launch.json 。
这两个文件按 F5 后会自动在 .vscode 目录下生成。
一般默认生成的 tasks.json 文件如下：
我们需要关注的选项有：
深入理解 tasks.json 文件的作用与 "command" 选项的用法，我们就能灵活地配置构建工程。
tasks.json 文件是用来构建工程的，当我们按 F5 进行调试时，VSCode 首先会执行 tasks.json 文件里 "command" 选项后的命令，并传入 "args" 参数，这样整个工程就被重新编译链接一遍了。
以 hello.c 文件和上述 tasks.json 为例，按 F5 进行调试时，最终会在命令行执行下述命令构建工程：
当然，如果一个工程有多个文件，"command" 就不能是简单的 gcc 了，需要根据实际的构建系统选择。
如果构建系统使用的是 Makefile ，那我们可以配置
这样在构建项目时就会使用命令
这跟我们平时使用 make 构建项目是一致的。
又比如配置 Zephyr 环境，
这样在构建项目时相当于执行命令
launch.json 文件用于配置调试环境。一般默认生成的文件如下：
我们需要关注的选项有：
VSCode 预定义了一些变量，可以在 Variables Reference 查看意思。
有时候我们的程序需要访问硬件资源，这一般需要 root 权限，而 VSCode 一般是在用户权限下启动的，这就需要特殊配置 VSCode 才能调试程序。
下面介绍如何利用 VSCode 以 root 权限调试程序。
首先需要注意到 launch.json 文件里的 "miDebuggerPath" 这个选项，它是调试器的路径，如果这个调试器可以以 root 权限运行，那么就达成了我们的目的了。
在 /home/user_name 目录下创建文件 gdb，user_name 需要替换为实际的用户名。
然后编辑该文件 vim gdb ，加入下述内容：
给 gdb 添加执行权限，
在修改 "miDebuggerPath" 成为
即可。这样我们就可以在 VSCode 里以 root 权限调试程序了，只不过每次都需要输入密码，因为有一个 sudo 过程。
为了解决这个麻烦，我又在网上找到了方法，将 /home/user_name/gdb 加入 sudo 的免密认证即可。
输入
编辑 /etc/sudoers 文件，修改成下述内容即可，
其中 jackis 是我的用户名，需要根据实际用户名替换。
NOPASSWD: 后的命令 sudo 时都不需要密码。退出 Shell，再重新打开一个命令行界面，输入 sudo apt update ，会发现没有提示输入密码了。
参考：
How to debug programs with “sudo” in VSCODE
How to Run sudo Commands Without Password
vscode怎么调试c语言 调试步骤
1、打开你要写c++程序的文件夹，我们这里新建一个Test文件夹并打开test，打开后：使用VScode运行调试C/C++，在左侧打开的目录中新建一个 main.cpp 文件。
2、新建后点左侧的调试按钮（英文：Debug），可以看到，目前没有调试配置。
3、这时我们需要配置自己的调试配置，回到资源管理器界面，我们可以看到目录下多了一个.vscode的文件夹，里面有一个launch.json文件。我们现在在这个文件夹中新建一个tasks.json文件。我们需要改写这两个json文件的内容。
{
version: 0.2.0,
configurations: [
{
name: Run C/C++,
type: cppdbg,
request: launch,
program: ${workspaceFolder}/${fileBasenameNoExtension}.exe,
args: [],
stopAtEntry: false,
cwd: ${workspaceFolder},
environment: [],
externalConsole: true,
MIMode: gdb,
miDebuggerPath: C:/Program Files (x86)/mingw-w64/i686-8.1.0-posix-dwarf-rt_v6-rev0/mingw32/bin/gdb.exe,
setupCommands: [
{
description: Enable pretty-printing for gdb,
text: -enable-pretty-printing,
ignoreFailures: false
}
],
preLaunchTask: build run file
},
{
name: Debug C/C++,
type: cppdbg,
request: launch,
program: ${workspaceFolder}/${fileBasenameNoExtension}.exe,
args: [],
stopAtEntry: false,
cwd: ${workspaceFolder},
environment: [],
externalConsole: true,
MIMode: gdb,
miDebuggerPath: C:/Program Files (x86)/mingw-w64/i686-8.1.0-posix-dwarf-rt_v6-rev0/mingw32/bin/gdb.exe,
setupCommands: [
{
description: Enable pretty-printing for gdb,
text: -enable-pretty-printing,
ignoreFailures: false
}
],
preLaunchTask: build debug file
}
]
}
其中tasks.json文件内容（直接复制即可）：
{
version: 2.0.0,
tasks: [
{
label: build debug file,
type: shell,
command: g++,
args: [
-g,
-o,
${fileBasenameNoExtension},
${file}
],
group: {
kind: build,
isDefault: true
}
},
{
label: build run file,
type: shell,
command: g++,
args: [
-o,
${fileBasenameNoExtension},
${file}
],
group: {
kind: build,
isDefault: true
}
}
]
}
4、我们已经完成了基本的配置工作，保存以上两个json文件后，再次点击左侧的调试按钮（Debug），可以发现出现了两个新的配置，一个是直接运行程序的Run，一个是用来调试程序的Debug。
5、我们写一个简单的c++程序来进行调试说明，程序源代码，我们在return 0这行添加了一个断点。
6、切换运行配置为Debug C/C++，点击运行按钮开始调试。
7、可以看到，弹出的终端输出了正确的结果，调试窗口中的变量中也有变量a和对应的值。
VSCODE 可无缝调试浏览器了！
2021-07-16 微软发布了一篇博客专门介绍了这个功能，VSCODE 牛逼！
在此之前，你想要在 vscode 内调试 chrome 或者 edge 需要借助于 Chrome Debugger 或者 the Microsoft Edge Debugger extension 这两款 vscode 扩展。
并且更重要的是，其仅能提供最基本的控制台功能，其他的诸如 network，element 是无法查看的，我们仍然需要到浏览器中查看。
更新之后，我们可以直接在 vscode 中 open link in chrome or edge，并且 「直接在 vscode 内完成诸如查看 element，network 等几乎所有的常见调试需要用到的功能」 。
效果截图：
使用方式非常简单，大家只需要在前端项目中按 F5 触发调试并进行简单的配置即可。这里给大家贴一份 lauch.json 配置，有了它就可以直接开启调试浏览器了。
原理其实和 chrome debugger 扩展原理类似。也是基于 Chrome 的 devtool 协议，建立 「websocket 链接。通过发送格式化的 json 数据进行交互」 ，这样 vscode 就可以动态拿到运行时的一些信息。比如浏览器网络线程发送的请求以及 DOM 节点信息。
你可以通过 「chrome devtool protocol」 拿到很多信息，比如上面提到的 network 请求。
由于是 websocket 建立的双向链接，因此在 VSCODE 中改变 dom 等触发浏览器的修改也变得容易。我们只需要在 VSCODE（websocket client） 中操作后通过 websocket 发送一条 JSON 数据到浏览器（websocket server）即可。浏览器会根据收到的 JSON 数据进行一些操作，从效果上来看 「和用户直接在手动在浏览器中操作并无二致。」
值得注意的，chrome devtool protocol 的客户端有很多，不仅仅是 NodeJS 客户端，Python，Java，PHP 等各种客户端一应俱全。
hambot如何在vscode调试
1、首先打开Vscode软件，进入主界面。
2、其次在Vscode中，我点击运行菜单按钮。
3、最后就可以在这里按下启用调试按钮进行启动。
