- vConsole:Web 调试面板
vConsole 会在你网页中加一个悬浮的小按钮,可以点击它来打开关闭调试面板,并查看 DOM、Console、Network和 本地存储 等信息。基本可以满足普通前端开发的需求。使用方法也很简单,通过npm安装或者直接在需要的页面引入 js文件 ,然后 new VConsole() 就可以了。
- Charles
Charles 是一款强大的抓包工具,可以截取包括 https 在内的各种网络请求并方便的查看具体信息。有 Mac、Windows 和 Linux多版本,通过配置 WIFI 代理,也可以拦截手机发出的请求。毕竟前端相当一部分报错是网络错误或数据不符合预期导致的(甩锅后端😄)。所以通过拦截 http 请求,查看具体的请求信息和数据,能获取很多有用的信息,可以在一定程度上帮助 debug。
- Chrome浏览器 + Android
使用Chrome中的 Inspect,直接在PC端调试android机器中的webview的页面。
- Mac + IOS + Safari
方法基本同上