vConsole.js 其实就是重写console方法,实现了类似于微信小程序的移动端调试效果

在普通html文件里使用

<script src="https://cdn.bootcss.com/vConsole/3.3.0/vconsole.min.js"></script>
<script>
// init vConsole
var vConsole = new VConsole();
console.log('Hello world');
</script>

这时候当你打开页面右下角就会出现一个绿色按钮

点击就会显示类似浏览器的控制台

vue里使用方法-----------------

首先安装

npm install vconsole

然后引入

import vsconsole from 'vconsole';
 
最后在js代码里实例化一下:
new vsconsole();
 

移动端调试神器vConsole的更多相关文章

  1. 移动端调试神器vconsole,手机端网页的调试工具Eruda

    移动端调试神器vconsole,手机端网页的调试工具Eruda 移动端中使用 vConsole调试 移动端调试工具vconsole安装Git地址:https://github.com/WechatFE ...

  2. 移动端调试神器-vConsole

    什么是vConsole?   官方说明是一个web前端开发者面板,可用于展示console日志,方便日常开发,调试. 简单来说相当于移动版的Chrome调试控制台,就是我们在PC端常用的F12 vCo ...

  3. 移动端真机debug调试神器 vConsole学习(一)之基础

    参考 使用方法 移动端真机debug调试神器 vConsole的引入说明(原生态与WebPack) 移动端使用vconsole调试console vConsole ——开源的前端 console 调试 ...

  4. 移动端调试利器-vConsole

    现在移动端开发越来越火,随之而来的问题也越来越多,今天给大家介绍一款移动端调试神器,vconsole. 一.先引用文件,可以从https://www.bootcdn.cn/vConsole/下载,也可 ...

  5. 移动端真机debug调试神器 vConsole学习(二)之实战

    项目中实际使用 在项目中实际使用的时候发现还是有很多问题的 最初使用方式  <script src="vconsole.min.js"></script> ...

  6. Eruda 一个被人遗忘的移动端调试神器

    引言 ​ 日常工作中再牛逼的大佬都不敢说自己的代码是完全没有问题的,既然有问题,那就也就有调试,说到调试工具,大家可能对于fiddler.Charles.chrome devtools.Firebug ...

  7. 移动端调试神器 whistle

    移动端h5页面嵌入的方式多种多样,普通的chrome真机调试功能有时就不能满足要求了. whistle通过设置wifi服务器代理的方式,可以抓包调试所有移动端请求的页面. whistle的github ...

  8. 移动端调试神器(eruda)

    在日常的移动端开发时,一般都是试用chrome浏览器的移动端模式进行开发和调试,只有在chrome调试完成,没有问题了才会上到真机测试,移动端开发的一大问题就在于此, 各种品牌各种型号手机,手机中各种 ...

  9. 两大js移动端调试神器 / 调试工具分享 !

    分享大家一个CDN网站:https://www.bootcdn.cn/ eruda 移动端网页调试工具的使用: <script src="https://cdn.bootcdn.net ...

随机推荐

  1. yum 程序包管理简介

    rpm可以实现程序的快速,简单安装(跟编译安装比),但是rpm自己不能解决依赖,所以很多工具为了自动解决依赖应运而生,其中yum就是其中之一. yum解决依赖的办法: 必须有个文件服务器,里面放置所以 ...

  2. python 學習深淺拷貝、集合、、作用域、函數

    python 學習深淺拷貝.集合..作用域.函數 2020開年新冠肺炎流行大部分人員.工廠.單位無法復工生產,人員隔離每天外出都要戴口罩,在家隔離期間悶壞了感覺把半年的口糧都幹掉了,嚴重考察大家的資本 ...

  3. VEH帮你定位程序崩溃地址

    之前朋友有一个服务端程序,总是受到一些人的恶意漏洞攻击,没有源代码,只好反汇编修复了漏洞,并且使用WinLicense加保护授权. 漏洞总不是一次可以修复完的,恶意攻击并没有停止,然后加了WL保护程序 ...

  4. ts中的泛型

    /** * 泛型:软件工程中,我们不仅要创造定义良好的API,同时也要考虑可重用行,组件不仅能 * 够支持当前的数据类型,同时也能够支持未来数据类型. * 通俗理解:泛型就是解决类.接口.方法的复用性 ...

  5. 剑指offer-面试题60-n个骰子的点数-动态规划

    /* 题目: 计算n个骰子,出现和s的概率. */ #include<iostream> #include<cstdlib> #include<stack> #in ...

  6. [Python自学] Flask框架 (1) (Flask介绍、配置、Session、路由、请求和响应、Jinjia2模板语言、视图装饰器)

    oldboy:s9day114 参考博客:https://www.cnblogs.com/wupeiqi/articles/7552008.html 一.Flask简介 1.安装Flask pip i ...

  7. SQL语法学习记录——JOIN

    学习内容参考来源:www.runoob.com JOIN准备 --为了方便练习,在数据库中创建演示数据: create database TEST; use TEST ; ---------- go ...

  8. HTML单词

    html超文本标记语言 head 头部font 字体 字形i(italic) 倾斜,斜体字big 大的,字体加大hr 水平线Pre(predefined)预定义h5标题5Div(division)区隔 ...

  9. css基础-盒子模型+背景和列表

    border-style的值: none 无 dotted 点状 dashed 虚线 solid 实线 double 双实线 margin: 垂直方向两个相邻元素都设置了外边距,那么外边距会发生合并 ...

  10. Android实战项目——家庭记账本(一)

    今天是家庭记账本APP开发的第一天,主要是做了一部分UI设计,不得不说,虽然web开发和Android开发有很多相似的地方,但是一个Android APP是很难三个小时开发完成的. 通过今天的学习与开 ...