前端调试手段总结

PC浏览器中调试

这个没什么说的，各大浏览器都内置了调试了工具，作为一个前端不会的话，自行面壁吧。

移动浏览器中调试

• android
  可以直接使用usb+chrome://inspect/#devices调试,也可以使用和微信浏览器一样的操作
• ios
  和微信浏览器中一样操作调试,
  也可以使用safari调试。

微信浏览器中调试

• 微信中访问的肯定都是http URL，所以可以直接使用spy-debugger，
  也可以使用vconsole或者eruda，可以根据URL的参数决定
  是否显示调试器

;(function () {
    var src = 'node_modules/eruda/eruda.min.js';
    if (!/eruda=true/.test(window.location) && localStorage.getItem('active-eruda') != 'true') return;
    document.write('<scr' + 'ipt src="' + src + '"></scr' + 'ipt>');
    document.write('<scr' + 'ipt>eruda.init();</scr' + 'ipt>');
})();

• 还可以使用 微信开发工具进行调试，这对于调试微信sdk很方便,可以看到对接sdk时发生的错误。

APP webview中调试

• android
  可以使用usb线，然后使用chrome://inspect/#devices 进行调试

• ios
  1，webview 若是访问http URL的话，则可以使用spy-debugger进行调试
  2，webview 中若是访问的离线包（file协议），则不能使用spy-debugger，因为spy-debugger的原理是拦截所有html页面请求，然后将请求再返回设备，在spy-debugger上面调试，spy-debugger会直接将操作给推送到设备，所以设备可以随着一起改变。但是file协议根本没有网络请求，spy-debugger所做的代理根本不能起作用。此时可以使用vconsole
  3，若APP包是debug包的话，也可以使用safari调试，因为正式包的话是不允许调试的