博客内容来自: /p/a05b90ab03e4
我们在写webapp或者移动端网页需要嵌入到app时候,尤其是在APP内置的webView上加载我们的页面,想要查看手机浏览器信息是非常困难的事,当出现问题的时候,你又不能查看日志,一般会连接本地测试环境,然后在alert来打印日志(这种做法太蠢了),然后一遍一遍的定位bug,修改代码。使用eruda或vconsole之后感觉爽爆了,解决了这个问题,这个工具就想电脑端的devtools,可以查看日志,网络,页面,Resources等
1、eruda使用方法
多页面应用
<script src="/eruda/1.5.5/eruda.min.js"></script><script>eruda.init();</script>
单页面应用
npm install --save-dev eruda
;(function () {if (!/mdebug=true/.test(window.location.href)) return;var script = document.createElement('script')script.src = "/eruda/1.2.6/eruda.min.js"script.async = truedocument.getElementsByTagName('head')[0].appendChild(script)script.onload = function () {eruda.init()}})()
在项目的入口引用这个文件就可以
只需要在地址栏增加mdebug=true即可调试
2、vconsole使用方法
多页面应用
<script src="/vConsole/3.3.0/vconsole.min.js"></script><script>var VConsole = new VConsole();</script>
单页面应用
npm install --save-dev vconsole
var vConsole = new VConsole();console.log('Hello world');