关于前端:移动端开发调试难试试这款神器

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

  咱们在开发手机版网页的时候，经常会呈现上面的情景：

• 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 导航站】。