简介

vConsole 是腾讯开源的一个网页调试面板，专为手机 web 页面量身设计，帮助开发者更为便捷地进行开发调试工作。
可能对于经常写h5的朋友们来说已经非常熟悉了，但是对于刚开始写h5，又苦于不知如何调试的人来说，还是值得一看。

项目地址：
https://github.com/WechatFE/vConsole
复制链接
http://wechatfe.github.io/vconsole/demo.html 到微信浏览器即可预览demo

使用方法

npm install vconsole

手动引入

<script src="项目的路径/vconsole.min.js"></script>
<script>
  // 初始化
  var vConsole = new VConsole();
  console.log('Hello world');
</script>

或者使用CDN

<script type="text/javascript" src="https://cdn.bootcss.com/vConsole/3.3.0/vconsole.min.js"></script>

<script>
    // 初始化
    var vConsole = new VConsole();
    console.log('Hello world');
</script>

在VUE中使用

import VConsole from 'vconsole'
const vConsole = new VConsole()
Vue.use(vConsole)

打印日志

 console.log("Hello world");
 console.info("Hello world");
 console.debug("Hello world");
 console.warn("Hello world");
 console.error("Hello world");

销毁vconsole

window.vConsole.destroy();