VS Code + Node.js 断点调试

最新推荐文章于 2025-07-04 11:49:25 发布

知识的芬芳和温柔的力量全都拥有的小王同学

最新推荐文章于 2025-07-04 11:49:25 发布

阅读量2.3k

点赞数

CC 4.0 BY-SA版权

分类专栏：前端文章标签： node.js

本文链接：https://blog.csdn.net/tensixchuan/article/details/123832978

前端专栏收录该内容

14 篇文章

订阅专栏

本文详细介绍Node.js的安装及环境配置过程，并介绍如何在VSCode中设置js文件的快速运行与断点调试。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一、安装Node.js

详情参考Node.js 安装配置

首先下载链接下载Windows Installer (.msi)并安装，之后一路next，安装模式选择add to path，可以自动添加路径至环境变量中。

win+r
cmd
path

测试是否成功添加至环境路径中

node -v

测试是否成功安装

因为nmp会随同NodeJS一起安装，所以不用单独安装。

npm -v

测试nmp是否安装成功

二、VS Code

1.打开左下角插件库，搜索 code runner 并下载

在这里插入图片描述
这样在js文件中，可以直接右键=》run code 或快捷键 ctrl + alt + n 直接运行js文件

下面的输出面板直接显示console.log内容，不用在浏览器中打开和查看了

2. 打开左下角插件库，搜索debugger for chrome 并下载

在这里插入图片描述

三、断点调试

点击左栏运行与调试按钮，然后在下拉框处选择添加配置

在这里插入图片描述

编辑launch.js

在这里插入图片描述
在configurations中添加一段：

		{
            "type": "node",
            "name": "调试js程序",
            "request": "launch",
            "program": "${workspaceFolder}/bd.js"
        },

变成：

{
    "configurations": [
        {
            "type": "node",
            "name": "调试js程序",
            "request": "launch",
            "program": "${workspaceFolder}/bd.js"
        },
        {
            "type": "pwa-chrome",
            "name": "http://127.0.0.1:5500/3.html",
            "request": "launch",
            "url": "http://127.0.0.1:5500/3.html"
        }
    ]
}

type 指类型，因为是调试js，所以这里选择node
name 为下拉框下的命名，根据命名选择调试配置
“request”: “launch”
program为当前入口，${workspaceFolder}/bd.js"表示当前工作路径下的bd.js文件，之后调试新的文件可以直接修改这里的路径，或者新增配置

点击左栏运行与调试按钮，打断点，然后在下拉框处选择添加刚刚加的配置，点击旁边绿色运行按钮就可以开始断点调试了