首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往
您找到你想要的搜索结果了吗?
是的
没有找到

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

inspector 注意 node --inspect 与 node --inspect-brk 的区别:--inspect 不会终断,--inspect-brk 在用户代码启动之前会终断,也就是代码在第一行就会暂停执行...在 Chrome 中打开 浏览器地址栏输入 chrome://inspect/ 按回车键,如下所示: ?...欲了解更多断点调试相关内容,参考了解 Chrome DevTools 更多信息,参考 使用断点暂停代码 对启动 Node.js 进程做调试 如果一个 Node.js 进程启动时没有加 --inspect-brk...远程调试 如果是在服务器上调试,建议不要让调试器监听公共 IP 地址,这可能会引起远程访问的安全风险,但我们又想用本地的方式调试该怎么办呢?...$ ssh -L 9221:localhost:9229 user@debug.nodejs.red Chrome DevTools 调试器的 Connection 中增加链接 默认情况下,Connection

2.7K10

React Native调试心得

它提供了图形化的V8 调试器。  ? Sources 面板可以让你看到你所要检查的页面的所有脚本代码,并在面板选择栏下方提供了一组标准控件,提供了暂停,恢复,步进等功能。...在窗口的最下方的按钮可以在遇到异常(exception)时强制暂停。源码显示在单独的标签页,通过点击 打开文件导航面板,导航栏中会显示所有打开的脚本文件。...跳入(Step into): 与 Step over 类似,但是当代码调用函数时,调试器会进去这个函数并跳转到函数的第一行。...仅当条件为真时,执行会在此暂停。  ? 心得:如果你想让程序在某处从来都不要暂停,可以编辑一个条件永远为false的条件断点。...不要忽略控制台 DevTools 控制台(Console) 可以让你在目前暂停的状态下进行试验。按 Esc 键打开/关闭控制台。 ?

5K70

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

因此,学习任何可以帮助你更有效地对 Web 应用程序进行故障排除的工具的基础知识和高级功能将使你成为更好的调试器。 要成为更好的调试器,你必须熟悉使调试更容易的正确工具。...它逐渐成为大多数开发人员测试和调试其网站和 Web 应用程序的首选 Web 浏览器。...debug() - 调试函数 为了修复不符合预期的页面、功能或组件,你通常会添加一个“调试器”;声明函数声明以激活调试器并尝试了解它有什么问题。 但是,这需要你手动进入源代码以添加这些调试器语句。...Chrome 允许你直接从控制台执行此操作,而无需使用 debug() 函数访问你的源代码。只需在控制台中调用它并将函数的名称传递给它,它就会自动将调试器注入到函数中,让你可以单步调试代码。...这意味着你可以在函数中某处暂停后立即重新运行前面的代码。 因此,你可以在当前调用堆栈中穿越时间(尽管在有限的范围内)。 注意:当你使用 Restart Frame Chrome 时,状态不会恢复。

3.5K30

React Native开发之调试

Chrome调试小技巧 Sources面板 Sources 面板提供了调试 JavaScript 代码的功能。它提供了图形化的V8 调试器。 ?...Sources 面板可以让你看到你所要检查的页面的所有脚本代码,并在面板选择栏下方提供了一组标准控件,提供了暂停,恢复,步进等功能。在窗口的最下方的按钮可以在遇到异常(exception)时强制暂停。...源码显示在单独的标签页,通过点击 打开文件导航面板,导航栏中会显示所有打开的脚本文件。...跳入(Step into): 与 Step over 类似,但是当代码调用函数时,调试器会进去这个函数并跳转到函数的第一行。...仅当条件为真时,执行会在此暂停。 ? 附:React Developer Tools插件使用

3.8K80

React Native调试技巧与心得

它提供了图形化的V8 调试器。 ? Sources 面板可以让你看到你所要检查的页面的所有脚本代码,并在面板选择栏下方提供了一组标准控件,提供了暂停,恢复,步进等功能。...在窗口的最下方的按钮可以在遇到异常(exception)时强制暂停。源码显示在单独的标签页,通过点击 打开文件导航面板,导航栏中会显示所有打开的脚本文件。...跳入(Step into): 与 Step over 类似,但是当代码调用函数时,调试器会进去这个函数并跳转到函数的第一行。...仅当条件为真时,执行会在此暂停。 ? 心得:如果你想让程序在某处从来都不要暂停,可以编辑一个条件永远为false的条件断点。...不要忽略控制台 DevTools 控制台(Console) 可以让你在目前暂停的状态下进行试验。按 Esc 键打开/关闭控制台。 ?

6.7K50

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

index.js 调试器会在第一行暂停,并显示以下 debug 提示: $ node inspect index.js < Debugger listening on ws://127.0.0.1:9229...单击任何行号以设置断点(显示为蓝色标记): 这里的 breakpoint 断点,负责指定调试器应在何处暂停处理。我们可以借此检查程序状态,包括局部和全局变量。...您可以定义任意数量的断点,或向代码中添加调试器语句,这些语句会在调试器开始运行时停止处理。...在 Chrome 中设置日志点 日志点为 console.log(),不涉及任何代码!执行此代码时会输出一条表达式,但与断点不同的是,处理过程不会暂停。...stop:停止应用程序和调试器Chrome DevTools 类似,我们可以右键单击任意行来添加: 标准断点 在指定条件下停止程序的条件断点,例如 x>3 计算花括号中表达式的日志点,例如 URL

32320

前端必须知道的开发调试知识 - 笔记

Bug 与 Debug:Bug 的产生、前端 Debug 特点 Chrome 的 DevTools 移动端 H5 调试:真机调试、代理工具调试 开发调试技巧 # 前端必须知道的开发调试知识...、Whistle、vConsole 等 多技巧:Console、BreakPoint、SourceMap、代理等 # Chrome 的 DevTools 我录过一期 Chrome 调试方法的视频,有兴趣也可以看看...; 最后还有一个比较少用的方法,用于展示 HTML 节点的 DOM 对象: console.dir # Sources— 源码 调试器使用: 使用关键字 debugger 或代码预览区域的行号可以设置断点...执行到断点处时代码暂停执行 展开 Breakpoints 列表可以查看断点列表,勾选 / 取消可以激活 / 禁用对应断点 暂停状态下,鼠标 hover 变量可以查看变量的值 在调试器 Watch 右侧点击...并允许调试 电脑打开 Chrome 浏览器,在地址栏输入: chrome://inspect/#devices 并勾选 Discover USB devices 选项 手机允许远程调试,并访问调试页面

1.1K20
领券