解决Webstorm Debug功能消失的问题

最新推荐文章于 2025-05-13 19:37:24 发布
最新推荐文章于 2025-05-13 19:37:24 发布
阅读量5.3k 收藏 1
点赞数 2
CC 4.0 BY-SA版权
分类专栏： 前端开发
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/sunhaobo1996/article/details/86648674
本文记录了一次在Webstorm中丢失Debug功能后的解决过程。作者发现是由于JavascriptDebugger插件被误关闭导致的问题，通过重新启用该插件，成功恢复了Debug功能。

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

背景

本来今天开开心心的码代码，但一次重启之后发现Debug功能没了……
吐血，无奈先重装了一下（保存了个人配置），无果
最气的是，Webstorm里Debug相关设置竟然离奇消失，真是酸爽
这几天各种坑啊，诸事不宜……

解决方案

绕了一圈发现是Javascript Debugger插件被关闭了……我真的要吐血了，年前各种坑？？

Setting -> Plugins -> Javascript Debugger，选中他，Apply，restart，OK

在这里插入图片描述

真的气死我了

webstorm debug调试vue项目
weixin_39417324的博客
08-10 3979
1.运行npm，然后控制台会打印下图中的地址，复制local的地址。2.run–>Edit Configuration，如下图.....
WebStorm 中调试 (Debug) JavaScript 文件(js)
Java小白白的博客
04-23 2469
在 WebStorm 中调试 JavaScript 文件，您可以设置断点，启动调试会话，并使用浏览器中的开发者工具来查看变量和执行流程。
前端代码调试：Webstorm调试js
热门推荐
EricaKang 的专栏
11-30 2万+
【前言】 目前前端开发JavaScript的debug一般都是用chrome和firefox的开发者工具进行调试，浏览器工具使用不方便，webstorm支持了在代码上打断点，在编辑器里debug js代码。类似Java后台 Eclipse debug效果。接下来就给大家介绍如何安装webstorm和对webstorm进行配置调试代码。 【Webstorm下载与安装】 1.官网
关于webstorm Debug失败的问题：Waiting for connection from JetBrains IDE Support Chrome extension.
kesin_lee的博客
09-03 2369
突然遇到这种情况：在webstorm中debug，但是会显示Waiting for connection from JetBrains IDE Support Chrome extension. Please make sure it is installed and is listening on port 63342. For help see documentation. 经过查询，找到了解决办法： （即：设置webstorm中的端口和chrome中JetBrains IDE Support插件的端口
使用WebStorm打断点调试Vue项目
最新发布
qq_19891197的博客
05-13 600
本文详细介绍了如何在WebStorm中配置和启动Vue项目进行调试。首先，需要在WebStorm中配置Vue启动服务，如果遇到空白选项，可以通过启动Vue项目或使用package.json来添加npm服务。接着，使用Debug模式启动项目，并记住启动成功的路径。然后，添加JavaScript调试配置，确保在调试时同时启动两个服务。最后，通过设置--remote-allow-origins=*来允许远程调试。整个过程旨在帮助开发者顺利配置和调试Vue项目。
【Webstorm】针对javascript调试debug无法连接至浏览器
qq_35863418的博客
04-24 2897
接下来就可以进行javascript debug进行调试了，只要配置javascript debug时选择上面新增或修改的browsers配置项即可。文件(File) > 设置(Settings) > 工具(Tools) > Web浏览器和预览(Web Browsers and Preview)点击 ‘+’ 新增一个chrome配置项或者是在原chrome配置项上点击edit。在命令行选项(Command line options)中输入。
无法使用debugger，debugger在项目中不生效，导致无法有效排查问题
qq_42259940的博客
03-08 3938
应用debugger调试Vue项目，需要在项目中需要的位置写debugger,项目运行后，打开浏览器按F12，在chrome sources页签中就会直接进入断点，至此就可以可以进行单步、跳步调试。debugger是浏览器提供的调试语句，其主要是通过停止JS的执行，相当于设置断点。在JS代码编写的过程中，我们都会通过浏览器的调试模式（F12）来检查代码逻辑是否正确，大多数我们都是通过设置断点来进行调试。2开启sourcemap。3谷歌浏览器设置解决。
避坑！解决webstorm无法调试的问题
m0_46275020的博客
04-28 6483
解决webstrom无法打开html的问题！
webstorm debug 出错
01-07
debug出现下面的错误，求大神，急 D:\node\node.exe D:\node\node_modules\npm\bin\npm-cli.js run dev –scripts-prepend-node-path=auto internal/modules/cjs/loader.js:797  throw err;  ^ Error: Cannot find...
webstrom Debug 调试vue项目的方法步骤
10-18
WebStorm是一款流行的集成开发环境（IDE），被广泛用于开发JavaScript应用程序...通过这些步骤，可以更高效地定位和解决问题，提高开发效率。希望这些信息能够帮助大家更好地理解和应用WebStorm进行Vue项目的调试工作。
完美解决webstorm启动索引文件卡死的问题
10-19
为了优化性能并解决这个问题，开发者可以采取以下方法来减少WebStorm在索引时的工作量： 1. 排除node_modules文件夹：通过在项目设置中配置文件夹排除规则，可以将node_modules文件夹排除在索引之外。这样WebStorm...
webstorm的egg debug断点无效
weixin_42212558的博客
03-24 3902
环境 egg 2.6.1 + TypeScript 3.0.0 、node.js 12.13.1 、IntelliJ IDEA 2019.3.1 遇到的问题 根据egg官网配置的idea后，仍无法在idea内打有效断点。起初以为是我使用了typescript的缘故，但在Chrome的调试器中断点是能够成功的。 解决方案 Edit Configurations => 新增 => A...
使用WebStorm进行javascript调试
weixin_34109408的博客
07-15 352
曾经的选择是使用火狐浏览器的Firebug插件，具体的用法到时候在细说，这篇文章登场的是开发静态网页及javascript的利器--webstorm. 一.相关软件安装和配置 　　安装WebStorm　　WebStorm官网：(https://www.jetbrains.com/webstorm/) 　　安装Chrome和JetBrains IDE...
westorm debug无法连接Google浏览器
Hello
06-08 1749
Webstorm debug无法连接浏览器
Webstorm无法调试JavaScript（使用JavaScript Debuger）
pipi_Pia_bibi_Biu的博客
06-14 948
No scripts loaded by Edge（Edge 未加载任何脚本）使用Chrome也是一样表现。这里发文，是想知道有没有大佬能找到出现这个问题的原因哈。在调试界面的脚本切页，显示。
解决前端网页debugger没生效
提笔忘字的帝国
12-03 558
开发者工具打开设置关闭忽略列表。
debugger 无效问题
天天写代码
12-21 2724
浏览器更新后,代码中的debugger在浏览器中无法生效了,这对于常用debuger来看上下文逻辑的我,简直就是晴天霹雳,直呼,不可能,绝对不可能.
webstorm断点无效
mmmMMM12345的博客
01-05 2470
今天在调试的时候发现断点突然就不行了，最后发现是文件名中多了个空格的原因 原来的文件名是 5. A 大家注意看点和A中间多了个空格 重命名文件后 5.A 再进行断点，正常了。真是奇葩的问题 ...
如何在WebStorm中调试JavaScript代码（补充）
明月看潮生的博客
03-22 1244
如何在使用Edge浏览器的情况下，在WebStorm中调试JavaScript代码。
使用webstorm debug
08-27
使用WebStorm进行debug时，可以通过以下两种方法开启debug模式。首先，可以通过在package.json文件中的"scripts"字段中添加"start"脚本来启动静态资源。具体代码如下： "scripts": { "start": "nodemon ./bin/www" } 如果在WebStorm中debug时遇到提示"Waiting for connection from JetBrains IDE Support Chrome extension. Please make sure it is installed and is listening on port 63342. For help see documentation."，可以按照以下步骤解决。首先，在WebStorm中打开Preferences，然后找到"Build, Execution, Deployment"，再选择"Debugger"。在这个页面上，可以找到"Debug"部分以及"Built-in server port"字段。确保该端口和Chrome浏览器中安装的JetBrains IDE Support插件的端口一致即可。具体操作可以参考这个网址：https://jetbrains.com.zh.xy2401.com/help/rider/Using_JetBrains_Chrome_Extension.html#change_default_JetBrains_Chrome_extension_port 如果在debug过程中出现了错误信息"Cannot find..."，可能是由于路径配置不正确导致的。可以检查一下路径是否正确，并确保所需的文件存在。此外，还可以尝试使用绝对路径来确保正确加载所需的模块或文件。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* [webstorm+node之debug](https://blog.youkuaiyun.com/Long861774/article/details/123875312)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 33.333333333333336%"] - *2* [关于webstorm Debug失败的问题：Waiting for connection from JetBrains IDE Support Chrome extension.](https://blog.youkuaiyun.com/kesin_lee/article/details/120086145)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 33.333333333333336%"] - *3* [webstorm debug 出错](https://download.youkuaiyun.com/download/weixin_38506138/14041544)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 33.333333333333336%"] [ .reference_list ]
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值