除錯 - daniel-qa/Vue GitHub Wiki

除錯

  • Chrome DevTools 的 Event Listener Breakpoints

只要 DOM 或物件觸發某些事件時,Chrome 會自動停在處理事件的程式碼上!

這功能特別適合偵錯那些 不知道從哪裡被綁定的事件。

在 DevTools → Sources → Event Listener Breakpoints 右側面板中,這裡會列出所有事件分類:

分類 常見用途
Mouse click、dblclick、mousedown、mouseup、mouseenter 🔥
Keyboard keydown、keyup、keypress
XHR / Fetch AJAX 請求 (axios、fetch) 偵錯最強搭檔 🔥
Timer setTimeout、setInterval
UI scroll、resize、input
Animation requestAnimationFrame
Clipboard copy、paste
Touch touchstart、touchend
Web Audio 音訊事件
  • Debug JavaScript

https://developer.chrome.com/docs/devtools/javascript?hl=zh-tw

  • 在 Chrome 中啟用非同步偵錯功能

https://learn.microsoft.com/zh-tw/visualstudio/javascript/debug-nodejs?view=vs-2022