首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

为什么谷歌Chrome的脚本调试器不允许我设置断点?

谷歌Chrome的脚本调试器不允许设置断点的原因可能有以下几个方面:

  1. 代码未加载或未执行:如果脚本尚未加载或未执行,调试器将无法设置断点。确保代码已加载并开始执行后再尝试设置断点。
  2. 代码被压缩或混淆:如果代码经过压缩或混淆处理,调试器可能无法正确识别代码的行号和结构,从而无法设置断点。在这种情况下,可以尝试使用源映射(source map)来还原压缩前的代码结构,以便调试器能够正确设置断点。
  3. 权限限制:在某些情况下,特定的网页或应用程序可能会限制脚本调试器的使用权限,从而禁止设置断点。这可能是出于安全性考虑或开发者意图。如果你没有权限设置断点,可能需要联系网页或应用程序的开发者以获取更多信息。

需要注意的是,以上只是一些可能的原因,具体原因需要根据具体情况进行分析。如果你遇到了无法设置断点的问题,建议先检查以上可能的原因,并尝试解决。如果问题仍然存在,可以提供更多详细信息以便进一步排查和解决。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

【调试】258- 前端调试各种收集-断点

谷歌浏览器(版本为69)为例,编辑器为VSCode(版本1.26.1) 断点方式一 这种方式是比较常用方式,在浏览器开发工具找到对应源码,在script脚本节点里面的代码行断点。 ?...只要找到源码,在脚本代码显示区域左边数字上添加断点即可,之后只要代码运行到断点处,开发工具就会进入调试状态。 注意:有的数字行是灰色,就是不可断点。...如果你谷歌浏览器没有这玩意,请升级版本,还是没有的话,请忽略这段话。虽然不知道这是什么时候出功能,但是偶然发现,它可以编辑之后真的保存到文件,这个可以当编辑器用了。 ?...注意:如果没有命中断点并且你断点不是红点,需要一个骚操作才能在VSCode断点调试:在打开谷歌浏览器开发工具源码断点调试一次(或者加关键字debugger触发调试,参考上面方式一),运行到断点处VSCode...如果用谷歌浏览器开发工具做调试器,可以尝试插件nim,启动node或自动打开标签页。

2.3K30

React Native调试心得

Chrome Developer Tools Chrome 开发工具 谷歌 Chrome 开发工具,是基于谷歌浏览器内含一套网页制作和调试工具。...源码显示在单独标签页,通过点击 打开文件导航面板,导航栏中会显示所有已打开脚本文件。 心得:Chrome开发着工具中Sources面板几乎是最常用功能面板。...通常只要是开发遇到了js报错或者其他代码问题,在审视一遍自己代码而一无所获之后,首先就会打开Sources进行js断点调试。...断点其实很简单 断点(Breakpoint) 是在脚本设置暂停处。在DevTools中使用断点可以调试JavaScript代码,DOM更新和 network calls。...做iOS开发同学都知道在Xcode中可以设置全局断点,其实在Chrome 开发者工具中也同样有与之对应功能,叫“Pause On Caught Exceptions”。

5K70

React Native调试技巧与心得

Chrome Developer Tools Chrome 开发工具 谷歌 Chrome 开发工具,是基于谷歌浏览器内含一套网页制作和调试工具。...源码显示在单独标签页,通过点击 打开文件导航面板,导航栏中会显示所有已打开脚本文件。 心得:Chrome开发着工具中Sources面板几乎是最常用功能面板。...断点其实很简单 断点(Breakpoint) 是在脚本设置暂停处。在DevTools中使用断点可以调试JavaScript代码,DOM更新和 network calls。...添加和移除断点 在 Sources 面板文件导航面板中打开一个JavaScript文件来调试,点击边栏(line gutter) 为当前行设置一个断点,已经设置断点处会有一个蓝色标签,单击蓝色标签...做iOS开发同学都知道在Xcode中可以设置全局断点,其实在Chrome 开发者工具中也同样有与之对应功能,叫“Pause On Caught Exceptions”。

6.7K50

React Native程序调试

Chrome 调试工具 Chrome 开发工具 谷歌 Chrome 开发工具,是基于谷歌浏览器内含一套网页制作和调试工具。开发者工具允许网页开发者深入浏览器和网页应用程序内部。...该工具可以有效地追踪布局问题,设置 JavaScript 断点并可深入理解代码最优化策略。...它提供了图形化V8 调试器。 ? Sources 面板可以让你看到你所要检查页面的所有脚本代码,并在面板选择栏下方提供了一组标准控件,提供了暂停,恢复,步进等功能。...断点Breakpoint 断点(Breakpoint) 是在脚本设置暂停处。在DevTools中使用断点可以调试JavaScript代码,DOM更新和 network calls。...做iOS开发同学都知道在Xcode中可以设置全局断点,其实在Chrome 开发者工具中也同样有与之对应功能,叫“Pause On Caught Exceptions”。

3.6K60

React Native开发之调试

Chrome 调试工具 Chrome 开发工具 谷歌 Chrome 开发工具,是基于谷歌浏览器内含一套网页制作和调试工具。开发者工具允许网页开发者深入浏览器和网页应用程序内部。...该工具可以有效地追踪布局问题,设置 JavaScript 断点并可深入理解代码最优化策略。...它提供了图形化V8 调试器。 ? Sources 面板可以让你看到你所要检查页面的所有脚本代码,并在面板选择栏下方提供了一组标准控件,提供了暂停,恢复,步进等功能。...断点Breakpoint 断点(Breakpoint) 是在脚本设置暂停处。在DevTools中使用断点可以调试JavaScript代码,DOM更新和 network calls。...做iOS开发同学都知道在Xcode中可以设置全局断点,其实在Chrome 开发者工具中也同样有与之对应功能,叫“Pause On Caught Exceptions”。

3.8K80

Node.js 项目调试指南

Node.js 是一种流行 JavaScript 运行时,与谷歌 Chrome 浏览器使用相同 V8 引擎。它是跨平台,在创建 Web 服务器、构建工具、命令行工具等方面越来越受欢迎。...单击任意行号来设置断点(显示为蓝色标记): 断点指定调试器可以暂停处理位置,这允许我们可以检查程序状态,包括局部和全局变量。...在 Chrome设置条件断点 假设你有一个运行 1700 次迭代循环,但你对最后一次状态感兴趣: for (let i = 0; i < 1700; i++) { // set breakpoint...在 Chrome设置日志点 日志点就像 console.log(),没有代码! 当代码执行一行时输出表达式,但与断点不同是,处理不会暂停。...step out : 继续处理到函数结束,返回调用命令 重新启动应用程序和调试器 停止应用程序和调试器Chrome DevTools 一样,你可以右击任何一行来添加: 一个标准断点

38820

关于 Node.js 调试,你需要了解一切

作者 | Craig Buckler 译者 | 核子可乐 策划 | 丁晓昀 Node.js 是一种颇具人气 JavaScript 运行时,与谷歌 Chrome 浏览器一样采用同款 V8 引擎。...单击任何行号以设置断点(显示为蓝色标记): 这里 breakpoint 断点,负责指定调试器应在何处暂停处理。我们可以借此检查程序状态,包括局部和全局变量。...您可以定义任意数量断点,或向代码中添加调试器语句,这些语句会在调试器开始运行时停止处理。...all breakpoints:禁用所有断点 pause on exceptions: 当发生错误时,停止处理 在 Chrome设置条件断点 假设我们有一个运行 1000 次迭代循环,但真正需要关注是最后一次迭代状态...在 Chrome设置日志点 日志点为 console.log(),不涉及任何代码!执行此代码时会输出一条表达式,但与断点不同是,处理过程不会暂停。

29020

你还在用 console.log 调试 ?

如果是,那这篇文章就是为您准备写这篇文章目的是让您了解 Chrome 开发工具提供高效工具,让您可以更好、更快地调试 Javascript 代码。...本文主要讲述以下几点内容: 设置断点以调试特定行代码 查看调用堆栈 暂停/恢复脚本执行 设置表达式 开发工具生产力提示和技巧 调试运行时代码 当代码出现 bug 或没有按照预期执行时,我们通常会查看开发者工具中...也就是说,函数调用将被跳过,除非您在函数中设置断点,否则调试器将不会在该函数中停止。 ?...例如,如果有99%时间只调试 userland 中代码感兴趣,可以在 Blackbox 中添加一个模式,将 node_modules 文件夹下所有脚本过滤掉。...要通过 Blackbox 过滤一个脚本,有两种方法: 右键单击 Sources 选项卡中 JS 脚本,然后单击“Blackbox Script” 转到Chrome设置页面,然后转到 Blackboxing

1.5K10

如何使用谷歌浏览器 Chrome 更好地调试

本文重点介绍使用 Chrome DevTools 更轻松地对 Web 应用程序进行故障排除一些最佳做法、关键功能和提示。 什么是谷歌浏览器开发工具?...在控制台中调用debug(functionReference)会增加一个调试器;引用函数声明第一行上语句。 DevTools 还提供断点,让你逐行执行代码。...你可以通过单击“源”面板中行号来添加它们。左键单击会自动添加断点,而右键单击数字可以设置条件断点,这对于调试循环非常有用。...在 DOM 元素上添加断点(属性/模板更改) 有时你可能需要在有条件或动态更改 DOM 元素上放置断点调试器。...尽管如此,这只是 Google Chrome DevTools 中提供众多功能一小部分。你还使用哪些其他工具和技巧?可以在下面的评论区告诉

3.4K30

Chrome 开发者工具 Console 面板里 VM 是什么含义

例子:在 SAP UI5 框架某处代码设置断点,例如 Device.media.getCurrentRange: 然后在 Chrome 开发者工具 Console 面板里直接调用这个函数,断点触发:...在 Chrome JavaScript 引擎(称为 V8)中,每个脚本都有自己脚本 ID。 有时 V8 没有关于脚本文件名信息,例如在 eval 情况下。...内容并且该内容包含 标记时,脚本将使用 eval() 进行评估,并被 Chrome Sources 视图识别为以 VM 开头新文件。...我们可以转到 网络 选项卡,找到 AJAX 请求,并查看整个 HTML 响应,包括您脚本。 使用 eval 时,javascript 会被扔进 Chrome 调试器 VM。...为了在 Chrome Debugger Sources 下查看使用 eval 创建 js,请在 js 末尾设置此属性: //# sourceURL=dynamicScript.js 或者,源映射将与生成文件具有相同名称

1.4K10

使用 Chrome Devtools 调试您 Node.js 程序

右上角五个图表,从左至右依次分别表示: Resume script execution(F8): 恢复脚本执行,每一次都会自动执行到断点处。...设置断点 在 Source 选项卡下,找到 app.js 这是我们测试脚本入口文件,如果是执行 --inspect-brk 标志,默认会停留在代码第一行处。...第一种设置断点方式,是在程序里加入 debugger 命令。 第二种设置断点方式是在编辑器窗口中单击要设置代码行,此时编辑器窗口中该行会处于被选中状态,还有一个右侧小箭头。...另外右下方 Breakpoints 面板中也展示出了我们设置断点。 ? 取消断点,再次单击选中代码行左侧,起到切换作用,或者右键选择 Remove breakpoint ?...$ ssh -L 9221:localhost:9229 user@debug.nodejs.red Chrome DevTools 调试器 Connection 中增加链接 默认情况下,Connection

2.7K10

chrome调试JavaScript脚本

Chrome DevTools 提供了一系列实用工具使得调试 JavaScript 应用不再是一件痛苦事。...源面板允许你查看正在浏览页面上所有的脚本。面板底部图标按钮分别提供了标准暂停、恢复以及逐条语句运行等操作。窗口底部还有一个按钮,在出现异常时可以强制暂停。...在不同选项卡中,Sources 都是可见,而且只要点击 show-file-navigator 就可以打开文件定位并且显示全部脚本。...当你代码调用另一个函数时候,调试器不会跳到那个函数代码中去,其焦点还是当前函数,而 Step into 则相反。...(适用于全平台) 如果想要查看其他支持快捷键,请参考 Shortcuts。 使用断点来调试 断点是在脚本中处于某种目的而停止或者暂停代码运行地方。

1.8K40

js_调试_01_14 个你可能不知道 JavaScript 调试技巧

"debugger;" 除了 console.log, “debugger;” 是最喜欢临时应急调试工具。一旦它在你代码中出现,Chrome 会自动地在执行到它所在位置时停下。...点击调试器 source 面板下面的 {} Pretty Print 按钮。 ? 8. 快速定位要调试函数 假设你想在某个函数中设置一个断点。...最常用两种方式是: 在调试器中找到相应行并设置一个断点 在你脚本中添加一个 debugger 以上两种方法,你都必须到你文件中找到你想调试那一行。...一个解决办法是将你不需要调试脚本设置成黑盒。也包括你自己脚本。更多关于调试黑盒信息请参考这篇文章 10. 在复杂调试中找到重要信息 在更复杂调试中我们有时想输出很多行。...在 Chrome Inspector 中,右键点击某个元素,然后选择 break on 设置来使用: ?

48930

VS Code 调试完全攻略(5):基于浏览器 React 应用

代码设置 为了加快速度,准备了一个简单 React 应用,你要做就是检出代码并启动 CRA 开发服务器: git clone git@github.com:thekarel/debug-anything.git...type:把调试器类型设置chrome,这意味着我们将在此配置中使用 Chrome 浏览器。...准备插件 每个调试器 type 都有其特定配置,所以请试着用 VS Code 随附便捷自动完成功能。...启动脚本 接下来,从调试侧边栏中或通过按 F5 键启动调试浏览器: ? 启动浏览器 像往常一样向代码添加断点: ? 断点 然后在调试浏览器中与网站进行交互,但是这次启用了调试功能?...在这种情况下,要做设置大致如下: 启动开发服务器 通过配置你 launch.json 在调试浏览器中打开应用 在源代码中设置断点 当你需要反复检查同一属性时,可以设置监视表达式 用 step 命令检查代码流

2.1K20

JavaScript 开发者需要了解15个 DevTools 技巧

DevTools 允许脚本被黑盒化,因此即使你选择进入调试器某个函数,它们也不会在调试器中打开。...在 Chrome DevTools Sources 面板中,打开一个文件,右键单击代码中某个位置,然后选择添加脚本以忽略列表。...使用条件断点 单击 Sources 面板中打开文件行号会添加一个断点。它会在执行到这一行时候暂停脚本,这样你可以单步执行代码来检查变量,调用堆栈等。...断点有的时候并不好用,例如,如果在运行 1000 次循环最后一次循环报错了。这时你可以添加一个条件断点,让它仅在满足特定条件时才触发断点,例如 i > 999 。...设置空闲状态以检查你应用如何响应锁定屏幕。

4.7K20

Linux编译C++

创建C++编译环境 安装VIM PLUS 为什么安装VIM PLUS: 可以为我们提供良好编译环境,高亮代码,智能提示等等~ git clone https://github.com/chxuan...此事将被报告异常) 1)此时脚本开始运行 2)选择python3解释编译ycm文件 此时脚本文件会问你是选择python2还是python3来编译ycm文件?...在这里选择3,在此之前请安装python3 3)开始安装插件 4)此时vimplus就安装成功了 安装Debug GDB和LLDB关系 调试器描述 GDBUNIX及UNIX-like...安装GDB调试器 yum install gdb (CentOS) gdb -v 查看gdb是否安装成功 安装LLDB调试器(暂时不写) 大多数电脑还是用GDB作为调试器,一般只有MAC使用且内置.../out执行程序 设置断点 设置断点之前我们进入gdb调试 gdb out 开始Debug b main 在main函数设置断点(此时程序会停在初始化第一条语句) run 执行程序 查看栈

22.8K50

(转)一探前端开发中JS调试技巧

当然,为了代码整洁,在调试完成后,还是应尽可能删除这些与业务逻辑无关调试代码。 JS断点调试 断点调试器功能之一,可以让程序中断在需要地方,从而方便其分析。...以Chrome开发者工具为例,我们来看一下JS断点调试基本方法。 Sources断点 首先,测试代码中我们通过上图console输出结果可以看出代码应该是正常运行了,但是为什么是应该呢?...既然除了设置断点方式不一样,功能和Sources面板添加断点效果一样,那么为什么还会存在这种方式呢?...想原因应该是这样:我们在开发中偶尔会遇到异步加载html片段(包含内嵌JS代码)情况,而这部分JS代码在Sources树种无法找到,因此无法直接在开发工具中直接添加断点,那么如果想给异步加载脚本添加断点...XHR断点强大之处是可以自定义断点规则,这就意味着我们可以针对某一批、某一个,乃至所有异步请求进行断点设置,非常强大。但是,似乎这个功能在日常开发中用得并不多,至少用得不多。

2.8K60

12种 console 相关方法,帮你快速提高调试效率!(建议收藏)

console.time方法是开始计算时间,console.timeEnd 是停止计时,输出脚本执行时间。...按名称调试和监控函数 DevTools Sources 面板(或 Firefox 中调试器)允许打开一个文件,并通过单击行号设置断点。...基于chrome浏览器也允许你通过在控制台中输入debug(functionName)来设置断点,例如: debug( doSomething ); 该函数必须在全局命名空间中可用,并且浏览器将在调用它时立即启动调试器...或者,“在调试器中打开”图标将在“调试器”窗格中定位处理程序,以便可以设置断点 Chrome实现没有那么好,但可以通过getEventListeners()函数传递一个DOM节点来查看所有事件监听器...已收录,有一线大厂面试完整考点、资料以及系列文章。

56421

程序员你是否熟练掌握Chrome开发者工具?

如今,用过Chrome后才切身体会到,Chrome浏览器无疑是最受前端青睐工具,原因除了界面简洁、大量应用插件,良好代码规范支持、强大V8解释器,javascript执行速度和内存占有率表现非常优秀之外...Chrome 开发者工具介绍及调试、使用技巧 1、先打开谷歌浏览器,然后打开调试界面,打开方式有三种 : 第一:按F12, 第二:shift+ctrl+i, 第三:鼠标右键点审查元素3、使用 Chrome 开发者工具调试 设置(条件)断点 与 Java 调试类似,Chrome 开发者工具提供了断点设置、删除与断点存储等基本功能。...同时,开发者工具也提供了设置条件断点功能,使开发者可以控制该断点只有在满足某一条件时才会被触发。当然,也可以直接单纯地设置非条件断点。...设置条件断点断点 Element 标签页对 CSS 控制 在网页开发过程中,经常需要在脚本中控制不同条件下页面的样式展示,例如页面中标签颜色,位置,大小等等,在 Chrome

1.1K40
领券