移动端调试工具vconsole与Eruda
1.vconsole2. Eruda随着web H5应用的广泛，很多原生软件采用原生+H5混合开发到的模式，对于安卓和IOS原生的app他们有自己的调试方式，比较友好，出现问题也比较好重现，而web app的js代码一旦部署上生产，代码和接口层面的报错很难捕捉，一般都要通过取日志去查看报错，为了方便定位问题，我的项目引入过以下两个调试工具，以下是对vconsole和eruda两个工具的使用和对比。
1.vconsole
vconsole基本能满足移动端的调试，调试效果如下图，但是vconsole的控制台比较单一，总体调试功能比较低配。并不是所有的控制台都会报错。有些忘记非空判断的代码报错，vconsole的控制台打印不出来。还有就是network模块的报文信息比较少，只有相应结果，但是接口的完整url和请求响应的报文头都没有。
github地址为：vConsole
引入方式如下：
npm install vconsole
引入：
<script src="path/to/vconsole.min.js"></script><script>// init vConsolevar vConsole = new VConsole();console.log('Hello world');</script>
2. Eruda
eruda这个工具是我们项目最近引入，替换vconsole工具的，对比vconsole工具eruda工具的功能是基本对其chrome浏览器调试工具来的。
console控制台代码报错功能捕捉更强，而且可以执行js代码；network功能比较完善，接口请求到的报文完整；sourcce可以查看源码；
4.element模块可以看到基本的html元素，和样式盒子布局和大小；可以手动清除缓存；不过，Eruda的包大小比较大；
github地址为：eruda
引入方式有如下三种：
1.npm 方式：
npm install eruda --save
引入方式：
<script src="node_modules/eruda/eruda.js"></script><script>eruda.init();</script>
在使用这个方式时候发现npm的引入方式，在本地调试无异常，但部署到测试环境无效，最后jekins编译检测报错发现，jekins报错指出缺少支持eruda的一个js文件，最后没采用npm的方式；
2. CDN方式
<script src="///npm/eruda"></script><script>eruda.init();</script>
js引入方式：
直接在项目入口引入eruda的js文件
<script>(function () {var src = '/src/eruda'; //指向eruda,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>');})();</script>
