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

在手机端浏览器模拟F12（实用小工具）相关推荐

【实用小工具】开发一个网页版LED点阵绘图模拟器
LED点阵显示控制实验,始终是微机系统.单片机控制等硬件实验中重要的一节. 实验内容包括控制显示,图案位置计算,完整图案设计等等步骤.其中完整图案的设计尤其是复杂图案或汉字总是需要手动计算位置,非常的 ...
[AI创造营]Wechaty实用小工具---证件照助手
[AI创造营]Wechaty实用小工具-证件照助手项目地址: https://aistudio.baidu.com/aistudio/projectdetail/2253862 你是否苦恼于没有条件 ...
微软出品的实用小工具
微软出品的实用小工具分享一些微软出品的实用小工具,希望对大家有所帮助. 文章目录微软出品的实用小工具 SysinternalsSuite常用工具 Autoruns procdump Process ...
分享一款绘制时序图的实用小工具
转自 | 果果小师弟今天分享一款实用小工具:WaveDrom,它是一个免费开源的在线数字时序图渲染引擎.它可以使用JavaScript, HTML5和SVG来将时序图的WaveJSON描述转成SVG ...
JavaFx 实用小工具超 60+ 大集合
怎么JavaFx的资料那么少?是不是已经被时代淘汰了呢? 淘不淘汰不敢断言,但是在知乎上曾经看过有人这么说过,我觉得也是蛮有道理的: 所以说,如果小伙伴们是自己感兴趣想做一些GUI小工具的话,用用Ja ...
人生时间计算器_工具拯救效率,高效拯救人生！70个全国工程人实用小工具+算量表格...
工具拯救效率,高效拯救人生.对在线工具的选取与运用,并不是炫技,而是实实在在提升工作效率.而这份工程量自动计算表+使用小工具对于造价人员而言,都是非常好的实用工具,让你比别人更高效的完成工作. 内容简 ...
WPF开发的实用小工具 - 快捷悬浮菜单
WPF开发的实用小工具 - 快捷悬浮菜单 ❝ 本文由网友投稿,Dotnet9站长整理.站长觉得这小工具很实用,站长家里.公司也在尝试使用了. 行文目录: 这工具有什么用? 正文源码获取及应用下载体验 ...
收藏取消收藏html,一键解除网页限制，浏览器收藏夹书签小工具
一键解除网页限制,浏览器收藏夹书签小工具经常上网都会遇到一些网站不能复制文字.不能选择或者不能使用右键菜单,有时候非常的不方便. 比如:要用朗读女,读选中文字时,如果该网站有网页限制:不支持选中,复 ...
Unity实用小工具或脚本—以对象方式访问MySql数据库
一.前言以对象方式处理MySql数据库顾名思义就是可以将每个数据库表作为一个类,没一条数据作为一个对象来进行操作,大致思路和我上一篇文章类似,这里不再赘述.文章后有资源下载地址,所使 ...

在手机端浏览器模拟F12（实用小工具）

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

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

在手机端浏览器模拟F12（实用小工具）相关推荐

最新文章

热门文章