VSCode Node.js 调试配置 (npm 脚本启动)
相当于直接使用 node 命令，用 npm run script 脚本 来启动 Node.js 程序是更为常见的场景，比如当目标是运行一个应用。
假设项目的 package.json 有一个用来调试的 debug 脚本：
我们要怎么启动项目的跟踪调试呢？
文档指路 ➡️ 【Node.js 调试入门】 、 【VSCode 中的 Node.js 调试】 、 【Launch 对 npm 及其他工具的配置支持】
VS Code 支持两种核心调试模式 Launch 和 Attach ，Launch 方式是直接以 debug 模式启动应用，并为我们自动添加一个调试器；而 Attach 方式则是将 VSCode 调试器连接到已经运行中的应用程序或进程。我们这里用的是 Launch 方式。
在终端运行：
或点击VSCode 的小甲虫图标：
上面蓝色位置圈错了，应该是第一个 Node.js。
VSCode 十分智能，预设了很多针对不同需求的启动配置：
让我们来做进一步的修改：
之前那个启动配置项可以删除，留下这个需要的即可。
我们将 console 属性 设置为外部终端，我们启动调试时 VScode 就会自动打开下图中对应的终端(根据操作系统)。可以根据个人使用习惯，自定义用什么终端 (比如我在 VSCode 设置的 Terminal › External: Osx Exec，从默认的改为了 iTerm2)。
别忘了先把我们的脚本加上端口
vscode为什么html和javascript无效调试控制台
vscode写html 代码不能运行 Code language not supported or defined是没有正确调试造成的，解决方法为：1、首先需要在这里打开vs code软件，新建后才能编译测试。2、此时我们就能在这里设置vs code软件的名称，既能开始设置。3、此时我们就能在这里选择项目的框架，选择后点击创建命令即可。4、当我们打开vs code软件并创建项目，就能来到这个界面窗口。5、此时我们就能在这里点击调试的菜单命令，点击后即可对命令的使用。6、因此，点击调试即可对vscode程序编译运行即可，如图所示。
vscode软件》文件》首选项》设置》修改配置文件settings.json中：根据语言运行》"code-runner.executorMap":{"javascript":"node","html":"C:\\Users\\Administrator\\AppData\\Local\\google\\Chrome\\Application\\chrome.exe"}根据文件后缀名运行》"code-runner.executorMapByGlob":{"*.js":"node"}vscode配置文件settings_json参考--CodeRunner插件便捷使用
[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调试vue项目
先决条件
你必须安装好 Chrome 和 VS Code。同时请确保自己在 VS Code 中安装了 Debugger for Chrome 扩展的最新版本。
在可以从 VS Code 调试你的 Vue 组件之前，你需要更新 webpack 配置以构建 source map。做了这件事之后，我们的调试器就有机会将一个被压缩的文件中的代码对应回其源文件相应的位置。这会确保你可以在一个应用中调试，即便你的资源已经被 webpack 优化过了也没关系。
打开 config/index.js 并找到 devtool 属性。将其更新为：
如果使用 vue-cli3 你需要设置 vue.config.js 内的 devtool 属性：
进入Debugger视图，添加Chrome配置，将内容替换成以下内容
设置断点
此处response返回数据
启动调试
在终端使用如下命令开启这个应用
进入Debug视图，选择‘vuejs:chrome’配置，然后按F5或点击绿色的play按钮
随着一个新的 Chrome 实例打开 ，你的断点现在应该被命中了。
NodeJs VSCode 断点调试
1.首先 你已经有一个.js 文件了，例如我的demo12.js
2.在工作区内打一些断点，如无异常的话应该是实心红点
3.点击 运行和调试 按钮
4.点击小齿轮按钮，修改配置文件
5.右键刚才那个js文件，复制出其相对路径，放在配置文件${workplaceFolder} 的后面
6.点击开始按钮，进行调试
运行成功后，程序会定位到打断点的地方，并且，调试控制台可以看到输入结果，上面的一排按钮与其他调试工具类似，不赘述了
在实际开发当中，可以配置多分launch.json文件，以应对不同项目的调试
修改name值用于区分，并且，要修改program ，将对应项目的入口文件配置在这里即可
