移动端开发调试难？试试这款神器！

  大家好，我是为广大程序员兄弟操碎了心的小编，每天推荐一个小工具/源码，装满你的收藏夹，每天分享一个小技巧，让你轻松节省开发效率，实现不加班不熬夜不掉头发，是我的目标！

  我们在开发手机版网页的时候，常常会出现下面的情景：

• 1.开发时，在自己电脑上运行得好好的，在手机上打开就挂了，但是手机上又看不到error log。
• 2.上线后，某用户表示页面失灵，但我们自己又重现不出来，看不到用户的出错信息。

  如果说(1)还可以通过电脑连接手机以查看log来解决，那(2)在没有完善的前端上报体系时就非常被动了。所以，今天小编推荐一款手机前端开发调试利器——vConsole。

特性

• 查看 console 日志
• 查看网络请求
• 查看页面 element 结构
• 查看 Cookies、localStorage 和 SessionStorage
• 手动执行 JS 命令行
• 自定义插件

上手

请下载 vConsole 新版本。（不要直接下载 dev 分支下的 dist/vconsole.min.js）

或者使用 npm 安装：

npm install vconsole

引入 dist/vconsole.min.js 到项目中：

<script src="path/to/vconsole.min.js"></script>
<script>
  // 初始化
  var vConsole = new VConsole();
  console.log('Hello world');
</script>

对于 TypeScript，可引入 d.ts 文件：

import 'path/to/vconsole.min.d.ts';

预览

结尾

  本期就分享到这里，我是小编南风吹，专注分享好玩有趣、新奇、实用的开源项目及开发者工具、学习资源！希望能与大家共同学习交流，欢迎关注我的公众号**【Github导航站】**。