Chrome Devtools

普通断点

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

条件断点

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

DOM断点

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

XHR断点

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

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

全局监听断点

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

事件断点

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

异常断点

在这里插入图片描述

VSCode

普通断点

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

条件断点

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

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

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

AtomGit 是由开放原子开源基金会联合 CSDN 等生态伙伴共同推出的新一代开源与人工智能协作平台。平台坚持“开放、中立、公益”的理念,把代码托管、模型共享、数据集托管、智能体开发体验和算力服务整合在一起,为开发者提供从开发、训练到部署的一站式体验。

更多推荐