当前位置:

首页 > 编程开发 > VSCode怎么配置Node.js使用Nodemon实现修改后端代码后调试器自动重新启动

VSCode怎么配置Node.js使用Nodemon实现修改后端代码后调试器自动重新启动

VSCode通过attach模式配合nodemon实现热重载调试:先运行npm run debug(含--inspect-brk),再在launch.json中配置"request": "attach"、"port": 9229和"restart": true,确保调试器自动重连新进程。 想让VSC

本文目录

    VSCode通过attach模式配合nodemon实现热重载调试:先运行npm run debug(含--inspect-brk),再在launch.json中配置"request": "attach"、"port": 9229和"restart": true,确保调试器自动重连新进程。

    VSCode怎么配置Node.js使用Nodemon实现修改后端代码后调试器自动重新启动

    想让VSCode在代码保存后自动重启调试会话?其实,VSCode本身并不直接负责重启进程,但我们可以借助nodemon来实现这个效果。关键在于理解其工作原理:不是“VSCode重启了进程”,而是“VSCode主动连接上了nodemon重启后的新进程”。

    用 attach 模式连接 nodemon 启动的进程

    这是目前最稳定、兼容性也最好的方案。它的核心思路是让VSCode只做一件事:监听并连接到一个已经存在的调试端口。这样一来,就完全避开了VSCode在不同操作系统下直接启动nodemon可能遇到的各种路径问题。

    具体操作,可以遵循下面这个流程:

    • 首先,nodemon启动时必须带上--inspect或--inspect-brk参数,这是打开调试端口的前提。
    • 在package.json里配置一个调试脚本,例如:"debug": "nodemon --inspect-brk ./index.js"(请根据你的实际入口文件调整路径)。
    • 接下来,先在终端运行npm run debug。当你看到终端输出类似“Debugger listening on ws://127.0.0.1:9229/...”的信息时,就说明调试端口已经就绪了。
    • 最后,在.vscode/launch.json中添加一个attach类型的配置。需要关注的几个关键字段是:"request": "attach"、"protocol": "inspector"以及至关重要的"restart": true。
    • 关于进程ID,使用"processId": "${command:PickProcess}"手动选择是一种方式,但更推荐直接固定端口,比如配置"port": 9229。这样可以省去每次手动选择进程的麻烦,实现自动连接。

    launch 模式下用 runtimeExecutable 的坑

    很多开发者一开始会尝试让VSCode的launch模式直接去执行nodemon,但这往往会导致一些意想不到的问题。比如在Windows上可能会报spawn nodemon ENOENT错误,而在macOS或Linux上,VSCode也可能找不到项目本地node_modules/.bin/目录下的nodemon。

    问题出在哪里呢?

    • 首先,runtimeExecutable的值不能简单地写成"nodemon"。因为VSCode默认会去系统的PATH环境变量里查找,而不会主动去识别项目本地的node_modules。
    • 那么,写成绝对路径"${workspaceFolder}/node_modules/.bin/nodemon"总行了吧?理论上可行,但在Windows系统下,由于脚本扩展名(可能是.cmd)的问题,这个路径仍然可能失效。
    • 一个更稳妥的变通方法是,将runtimeExecutable设置为"npm",然后通过runtimeArgs参数来调用我们定义好的脚本,例如:"runtimeArgs": ["run", "debug"]。
    • 采用这种方式,你必须确保package.json中的debug脚本已经明确包含了--inspect参数,否则调试端口依然无法打开。

    为什么 --inspect-brk 比 --inspect 更适合调试

    在参数选择上,--inspect-brk通常比单纯的--inspect更受调试者青睐。原因很简单:-brk这个参数会让Node.js进程在执行第一行代码前就自动暂停。

    这个“暂停”非常关键。它确保了你可以在任何初始化逻辑(比如Express中间件的加载、数据库连接的建立)执行之前,就有充足的时间来设置好断点。如果没有这个暂停,你可能会发现,断点虽然设在了require之后、app.listen()之前,但代码“嗖”一下就过去了,根本停不下来。

    • 本质上,--inspect-brk相当于在代码开头插入了一个debugger语句。VSCode的调试器附加成功后,会自动继续执行,之后你就可以在任何需要的地方自由设置新的断点了。
    • 值得注意的是,如果你使用的是上面推荐的attach模式并固定了端口,那么对于VSCode来说,连接--inspect-brk启动的进程和连接--inspect启动的进程,在行为上没有区别。但这个参数对于开发者肉眼确认“调试进程已准备就绪”的状态,非常有帮助。

    最后,还有一个极其容易忽略的细节:VSCode配置中restart: true这个选项,其生效的前提是调试器已经成功附加(attach)到了目标进程。而能否附加成功,又完全取决于nodemon是否已经启动并打开了调试端口。

    所以,正确的操作顺序必须是:先在终端运行npm run debug,然后再点击VSCode的绿色调试启动按钮。如果顺序反了,调试器就会一直卡在“等待连接”的状态,无法正常工作。记住这个顺序,问题就解决了一大半。

    本站声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系bd@zhengruan.com
    作者最新文章
    编程开发
    相关文章 更多
    金山办公吴庆云:demo上线很快但落地效果往往很差
    金山办公吴庆云:demo上线很快但落地效果往往很差

    新京报贝壳财经讯(记者陈维城)8月21日,“WPS Comate百城AI智能体赋能计划”正式拉开帷幕。金山办公副总裁吴庆云直言,大模型并非无所不能,其能力是有边界的,demo上线虽快,但实际落地效果常常不尽如人意。“过去几年,算力、算法和数据一直是大家关注的焦点,而今年,我们终于能够将应用推到前台。

    疑虑无效?全球首款AI工程师Devin实测结果揭示缺点,或许挑战不足以击败程序员?周鸿祎或许暂时胜出!
    疑虑无效?全球首款AI工程师Devin实测结果揭示缺点,或许挑战不足以击败程序员?周鸿祎或许暂时胜出!

    编译|言征出品|51CTO技术栈(微信号:blog51cto)在李彦宏和周鸿祎就“AI是否会取代程序员”争论之后的第二天晚上,社交媒体上开始疯传一款号称是“全球首款AI软件工程师”的Devin。Devin(英文中寓意:神秘、完美,Godlike),脱颖而出的地方在于,跟以往的GithubCopilot等编码助手不同,它能够独立地、端到端地、处理整个软件项目。而它的公司CognitionLabs,已经获得了2100万美元的投资支持,其中包括彼得·泰尔的FoundersFund,人气陡升。如果Devin成功,

    SpringBoot基本web开发demo的方法
    SpringBoot基本web开发demo的方法

    1.在创建的springboot项目中的pom.xml中导入Lombok的依赖org.projectlomboklombok1.18.62.安装Lombok插件3.在主启动类的同级创建实体类的包,在包中创建实体类,并在实体类上使用Lombokpackagecom.hxy.bean;importcom.fasterxml.jackson.annotation.JsonFormat;importlombok.AllArgsConstructor;importlombok.Data;importlombok.N

    python random库如何使用demo
    python random库如何使用demo

    pythonrandom库简单使用demo当我们需要生成随机数或者从一个序列中随机选择元素时,可以使用Python内置的random库。下面是一个带有注释的例子,演示了如何使用random库:#导入random库importrandom#生成一个0到1之间的随机小数random_float=random.random()print(random_float)#生成一个指定范围内的随机整数(包括端点)random_int=random.randint(1,10)print(random_int)#从列表中随

    怎么用redis做秒杀支撑的demo
    怎么用redis做秒杀支撑的demo

    用redis做秒杀的库存扣除,限制每个账号只能抢购一次,这个简单的demo使用了string,hash,list三种基本类型.用string类型的int值来存储剩余库存,并在抢购成功后减1用hash来存储"已抢购到"的会员的id(可以确保用户id作为field的唯一性).注意:这个hash的field对应的uid不一定抢购成功用list来保存真正抢购成功的会员id的列表,作为后续处理订单的队列第一次写的时候,尝试过使用string的bitmap来保存该会员是否抢购成功过,但是这个在高并发时会出问题,所以后

    GitHub六个AI开源项目能做什么?软件理解、语音与求职场景
    GitHub六个AI开源项目能做什么?软件理解、语音与求职场景

    解析六个GitHub AI开源项目的具体用途,包括软件静态分析、智能体回答检查、多语言配音、求职材料生成、本地代码检索及动态歌词展示,帮助开发者根据实际需求筛选工具并正确验证结果。

    opencode安装skills教程及本地配置方法
    opencode安装skills教程及本地配置方法

    遇到OpenCode Skills无法加载或配置无效?本文手把手教你完成Skills的安装、环境变量设置及本地调试,避开常见坑点,让AI助手更懂你的代码习惯。

    如何开启Visual Studio2022实时代码分析警告提示
    如何开启Visual Studio2022实时代码分析警告提示

    解决 Visual Studio 2022 编辑时不显示代码分析警告的问题。指南涵盖 .NET 项目实时分析设置、Roslyn 分析器范围调整及错误列表来源筛选,确保开发者能高效利用实时代码诊断功能。

    如何在Visual Studio2022查看变量监视窗口调试程序
    如何在Visual Studio2022查看变量监视窗口调试程序

    详解 Visual Studio 2022 调试技巧:包括断点设置、监视窗口开启方法、变量添加步骤以及通过 F10 单步执行观察变量值变化的全过程。

    Visual Studio2017设置默认编码为UTF-8不带BOM
    Visual Studio2017设置默认编码为UTF-8不带BOM

    针对 Visual Studio 2017 缺乏全局默认编码选项的情况,详解如何利用 .editorconfig 设定项目级 UTF-8 无 BOM 规则,以及手动转换现有文件并校验字节的方法。

    查看更多
    精品专题 更多
    装机必备
    装机必备

    正软商城装机必备专区,精选办公、浏览器、安全防护、影音播放、压缩解压、设计创作和系统工具等电脑常用正版软件,帮助用户快速完成新电脑软件配置。

    Windows
    Windows

    正软商城Windows软件专区,汇集适用于Windows电脑的办公、设计、安全防护、影音播放、开发工具和系统优化软件,提供软件介绍、系统要求、正版授权及购买下载服务。

    PDF教程
    PDF教程

    正软商城PDF教程频道提供PDF编辑、转换、合并、拆分、压缩及格式处理方法,同时介绍常用PDF软件和工具的使用技巧。

    Mac软件 更多
    讯飞智作 网页版
    讯飞智作 网页版
    Windows/ macOS/ Linux

    讯飞智作是一款基于语音合成技术、虚拟人驱动技术与数字人形象声音构建能力的 AI 数字人音视频创作平台。

    火山引擎 网页版
    火山引擎 网页版
    Windows/ macOS/ Linux

    火山引擎是字节跳动旗下企业级云与AI服务平台。聚焦大模型核心能力,依托字节自研豆包多模态大模型,凭借火山方舟一站式平台,提供模型精调、推理部署、智能应用搭建等全链路服务,结合高性能AI算力,助力各行业快速落地大模型数字化与智能化应用。

    Aperty macOS版
    Aperty macOS版
    macOS

    Aperty 是 Skylum 推出的 AI 人像修图软件,支持自然肤质修饰、瑕疵处理、面部与身体调整、预设及批量同步。

    WINDOWS 更多
    讯飞智作 网页版
    讯飞智作 网页版
    Windows/ macOS/ Linux

    讯飞智作是一款基于语音合成技术、虚拟人驱动技术与数字人形象声音构建能力的 AI 数字人音视频创作平台。

    火山引擎 网页版
    火山引擎 网页版
    Windows/ macOS/ Linux

    火山引擎是字节跳动旗下企业级云与AI服务平台。聚焦大模型核心能力,依托字节自研豆包多模态大模型,凭借火山方舟一站式平台,提供模型精调、推理部署、智能应用搭建等全链路服务,结合高性能AI算力,助力各行业快速落地大模型数字化与智能化应用。

    PixTV 网页版
    PixTV 网页版
    Windows

    PixTV 是一款在浏览器中使用的 AI 视觉内容创作平台,提供图片、视频、音频、文字生成、AI 分镜、局部重绘、提示词反推和无限画布等工具,适合短剧、漫剧、广告及社交媒体内容制作。