黑马程序员技术交流社区

标题: 【上海校区】移动端调试痛点？——送你五款前端开发利器 [打印本页]

---

作者: 不二晨    时间: 2018-8-20 09:31
标题: 【上海校区】移动端调试痛点？——送你五款前端开发利器
之所以写这个总结，还要从上周的一次移动端项目的 debug 说起。那天，测试小姐姐拿着自己的 iphone6s 过来找我，说页面打不开。我想：这怎么可能，我手机里挺好的呀，Chrome调试工具也没报错呀！就把她手机拿过来看了看，发现一进去还真就是一片空白。WTF（手动黑人问号）！！！那问题就来了，开发环境下没报错，可真机又出现了意料之外的情况，而且没法像 PC端 那样祭出 F12 大法，怎么定位问题并解决呢？最后凭借着我（谷歌）的聪明才智，找到了媲美 PC端 调试体验的方式。在此总结一波，献给各位被移动端真机调试折磨，而又无从下手的前端er们，话休烦絮，直接奉上：
1. vConsole 推荐指数：★★★☆☆腾讯出品的 Web 调试面板，相信不少前端小伙伴都用过。vConsole 会在你网页中加一个悬浮的小按钮，可以点击它来打开关闭调试面板，并查看 DOM、Console、Network和 本地存储 等信息。基本可以满足普通前端开发的需求。使用方法也很简单，通过npm安装或者直接在需要的页面引入 js文件 ，然后 new VConsole() 就可以了。不熟悉的小伙伴可以直接去官方的 GitHub 看 README。但是它并没有解决我的问题，因为我的 bug 严重到一进页面就报错，脆弱的 javascript 直接原地爆炸

---

作者: 梦缠绕的时候    时间: 2018-8-21 16:27

---

欢迎光临 黑马程序员技术交流社区 (http://bbs.itheima.com/)

黑马程序员IT技术论坛 X3.2