在手机端浏览器实现模拟F12开发者调试工具

　　站长程序员一般使用电脑版谷歌浏览器模拟手机端没问题，但是真机上使用就会出现bug，手机浏览器没有F12，很难定位bug原因。

　　偶尔找到一款工具，可以方便的在手机端打开F12，记录一下分享给大家。

　　这款工具就是vconsole，记录一下使用方法：

　　一、多页面，用script的方式引入

　　首先引入vconsole

<script src="http://wechatfe.github.io/vconsole/lib/vconsole.min.js?v=3.2.0"></script>

　　之后在需要使用的页面引入

var vConsole = new VConsole();

　　如果是生产环境，不想让用户看到，可以这样做：

if(window.location.href.indexOf("debugger")!=-1){
var vConsole = new VConsole();
}

　　在页面url加一个debugger就可以启动调试模式。

　　二、单页面应用，比如在vue中引入

　　首先

npm install vconsole

　　之后在main.js或者需要的页面引入

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