3

前言

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

配置

  1. vscode打开node项目点击左侧调试按钮
    image-20210422114604687
  2. 点击Run and Debug
    image-20210422115211686
  3. 选择语言为nodejs
    image-20210422115306221
  4. 点击设置按钮添加配置
    image-20210422115355821
  5. 更改lanuch.json配置文件
    image-20210422115449595
  6. 添加自己的项目启动脚本文件和配置

    {
        // 使用 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项目的启动文件
  1. 再次点击断点调试按钮启动断点调试
    image-20210422115727574
  2. 直接点击启动程序启动断点调试
    image-20210422141138335
  3. 直接在代码左侧需要断点的位置打个断点标记,执行方法是会自动出发断点
    image-20210422141453212
  4. 然后通过上面的调试按钮一步步断点
    image-20210422141603851
  5. 鼠标悬浮还可以看到断点的数据
    image-20210422141655187
  6. 当然也可在debug console控制台输出断点数据的结果 相当于浏览器断点是的console控制台
    image-20210422141944344
  7. 如果要结束断点直接点击上面的暂停键
    image-20210422141743539
  8. 以上就是整个vscode断点配置和断点调试的教程

兰俊秋雨
5.1k 声望3.5k 粉丝

基于大前端端技术的一些探索反思总结及讨论