搜索
首页开发工具VSCodevscode中如何断点调试nodejs

vscode中如何断点调试nodejs

May 14, 2021 am 11:24 AM
nodejsvscode断点调试

vscode中如何断点调试nodejs

在平时前端开发时,前端代码在浏览器上能很方便的断点调试,那么如果要调试node后端接口的话,该如何实现断点调试呢?

配置

vscode打开node项目点击左侧调试按钮

image-20210422114604687

点击Run and Debug

image-20210422115211686

选择语言为nodejs

image-20210422115306221

点击设置按钮添加配置

image-20210422115355821

【推荐学习:《vscode教程》】

更改lanuch.json配置文件

image-20210422115449595

添加自己的项目启动脚本文件和配置

{
    // 使用 IntelliSense 了解相关属性。 
    // 悬停以查看现有属性的描述。
    // 欲了解更多信息,请访问: https://go.microsoft.com/fwlink/?linkid=830387
    "version": "0.2.0",
    "configurations": [
        {
            "type": "node",
            "request": "launch",
            "name": "启动程序",
            "env": {
                "NODE_ENV": "development"
            },
            "program": "${workspaceFolder}/bin/www"
        }
    ]
}
//program这个是我自己的node项目的启动文件

再次点击断点调试按钮启动断点调试

image-20210422115727574

直接点击启动程序启动断点调试

image-20210422141138335

直接在代码左侧需要断点的位置打个断点标记,执行方法是会自动出发断点

image-20210422141453212

然后通过上面的调试按钮一步步断点

image-20210422141603851

鼠标悬浮还可以看到断点的数据

image-20210422141655187

当然也可在debug console控制台输出断点数据的结果 相当于浏览器断点是的console控制台

image-20210422141944344

如果要结束断点直接点击上面的暂停键

image-20210422141743539

以上就是整个vscode断点配置和断点调试的教程

更多编程相关知识,请访问:编程入门!!

以上是vscode中如何断点调试nodejs的详细内容。更多信息请关注PHP中文网其他相关文章!

声明
本文转载于:segmentfault。如有侵权,请联系admin@php.cn删除
Visual Studio:其功能的综合指南Visual Studio:其功能的综合指南May 01, 2025 am 12:14 AM

VisualStudio提供了多种功能来提高开发效率。1.界面与导航:通过菜单栏、工具栏等组件管理项目。2.代码编辑与智能感知:提供代码补全和格式化工具。3.调试与测试:支持断点设置和变量监视。4.版本控制:与Git等系统集成,方便团队协作。

Visual Studio与代码:安装,设置和易用性Visual Studio与代码:安装,设置和易用性Apr 30, 2025 am 12:05 AM

VisualStudio和VSCode各有优劣,适合不同开发需求。VisualStudio适合大型项目,提供丰富功能;VSCode则轻量、灵活,跨平台支持。

Visual Studio的目的:代码编辑,调试等等Visual Studio的目的:代码编辑,调试等等Apr 29, 2025 am 12:48 AM

VisualStudio是一款多功能的集成开发环境,支持多种编程语言和完整的开发流程。1)代码编辑:提供智能代码补全和重构。2)调试:内置强大调试工具,支持断点和变量监视。3)版本控制:集成Git和TFVC,方便团队协作。4)测试:支持多种测试类型,确保代码质量。5)部署:提供多种部署选项,支持从本地到云端的部署需求。

Visual Studio vs.vs代码:代码编辑器的比较Visual Studio vs.vs代码:代码编辑器的比较Apr 28, 2025 am 12:15 AM

VisualStudio适合大型项目开发,VSCode则适用于轻量级和高度可定制的环境。1.VisualStudio提供强大的智能感知和调试功能,适合大型项目和企业级开发。2.VSCode通过扩展系统提供灵活性和自定义能力,适用于多种编程语言和跨平台开发。

Visual Studio的定价:了解订阅模型Visual Studio的定价:了解订阅模型Apr 27, 2025 am 12:15 AM

VisualStudio订阅提供多种级别,适合不同开发者需求。1.基础版免费,适用于个人和小型团队。2.高级版如Professional和Enterprise,提供高级工具和团队协作功能,适合企业用户。

Visual Studio与代码:性能和资源使用情况Visual Studio与代码:性能和资源使用情况Apr 26, 2025 am 12:18 AM

VisualStudio和VSCode在性能和资源使用上的区别主要体现在:1.启动速度:VSCode更快;2.内存占用:VSCode更低;3.CPU使用率:VisualStudio在编译和调试时更高。选择时需根据项目需求和开发环境决定。

Visual Studio:C#,C等的IDEVisual Studio:C#,C等的IDEApr 25, 2025 am 12:10 AM

VisualStudio(VS)是微软开发的一款功能强大的集成开发环境(IDE),支持多种编程语言,如C#、C 、Python等。1)它提供了丰富的功能集,包括代码编辑、调试、版本控制和测试。2)VS通过强大的编辑器和调试器处理代码,并使用Roslyn和Clang/MSVC编译器平台支持高级代码分析和重构。3)基本用法如创建C#控制台应用程序,高级用法如实现多态性。4)常见错误可通过设置断点、查看输出窗口和使用即时窗口调试。5)性能优化建议包括使用异步编程、代码重构和性能分析。

Visual Studio:代码编译,测试和部署Visual Studio:代码编译,测试和部署Apr 24, 2025 am 12:05 AM

在VisualStudio中,代码编译、测试和部署的步骤如下:1.编译:使用VisualStudio的编译器选项将源代码转化为可执行文件,支持多种语言如C#、C 和Python。2.测试:利用内置的MSTest和NUnit等框架进行单元测试,提高代码质量和可靠性。3.部署:通过Web部署、Azure部署等方式,将应用程序从开发环境转移到生产环境,确保安全性和性能。

See all articles

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

Video Face Swap

Video Face Swap

使用我们完全免费的人工智能换脸工具轻松在任何视频中换脸!

热工具

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

PhpStorm Mac 版本

PhpStorm Mac 版本

最新(2018.2.1 )专业的PHP集成开发工具

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具

SecLists

SecLists

SecLists是最终安全测试人员的伙伴。它是一个包含各种类型列表的集合,这些列表在安全评估过程中经常使用,都在一个地方。SecLists通过方便地提供安全测试人员可能需要的所有列表,帮助提高安全测试的效率和生产力。列表类型包括用户名、密码、URL、模糊测试有效载荷、敏感数据模式、Web shell等等。测试人员只需将此存储库拉到新的测试机上,他就可以访问到所需的每种类型的列表。