Chrome Devtools

普通断点

  • 在Sources面板左侧代码行标位置左键单击
    在这里插入图片描述

条件断点

  • 在Sources面板左侧代码行标位置右键单击
    请添加图片描述
    请添加图片描述

DOM断点

  • 在HTML面板在DOM节点上右键单击
    请添加图片描述

XHR断点

可以根据url条件对所有的XHR命令打断点

  • Sources面板下面
    在这里插入图片描述

全局监听断点

  • Sources面板下面
    在这里插入图片描述

事件断点

  • Sources面板下面
    在这里插入图片描述

异常断点

在这里插入图片描述

VSCode

普通断点

  • 右侧行标位置左键单击
    在这里插入图片描述

条件断点

  • 右侧行标位置右键单击
    在这里插入图片描述

引用自知乎【神说要有光】

GitHub 加速计划 / de / devtools
45
5
下载
vuejs/devtools: Vue.js 开发者工具,这是一个浏览器插件,可以安装在 Chrome 和 Firefox 等现代浏览器中,用于调试 Vue 应用程序,提供了组件树查看、状态快照、时间旅行等高级调试功能。
最近提交(Master分支:4 个月前 )
79116147 - 5 个月前
f0359002 - 6 个月前
Logo

旨在为数千万中国开发者提供一个无缝且高效的云端环境,以支持学习、使用和贡献开源项目。

更多推荐