在手机端浏览器模拟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)