最近做移动端项目比较多,电脑上开发完了上真机必现问题,但是真机上又看不了代码很捉急啊有没有。

这两天才发现这个腾讯良品vConsole,以前开发小程序见过,但没想到他竟然还能被应用到我们的h5页面中,


废话不多说,先给大佬磕一个。

具体描述介绍啥的见githubhttps://github.com/Tencent/vConsole

我这里先记录下具体开发中是怎么引用的

1、按照官网的步骤,先安装vConsole工具包:

npm install vconsole

  

注:我当时在项目中使用,安装命令是

npm i --S vconsole

  

然后项目的入口js中引入并实例化,如下:

let VConsole = require('../../node_modules/vconsole/dist/vconsole.min');//路径根据项目自己找
let vConsole = new VConsole();

  

。。。

对,就这三句,一个强大的功能就诞生在我都页面了!

比如做些控制台输出信息:

//这是demo
console.log('我是控制台输出的信息!');
var a;
console.log(a);
console.log(html2canvas);

2019-06-03  17:04:25

vConsole 在安卓中字体过大的问题

 let u = window.navigator.userAgent,
android = u.indexOf("Android") > -1 || u.indexOf("Linux") > -1; if(android){
  $('#__vconsole').attr('style','font-size: 26');
}

因为vconsole是em单位的,把他的父元素根节点的font-size设置小一点,vconsole里边的子元素的字体自然就小了。

工具 - vConsole调试工具 在项目中的应用的更多相关文章

  1. 我在项目中是这样配置Vue的

    启用压缩,让页面加载更快 在我们开发的时候,为了方便调试,我们需要使用源码进行调试,但在生产环境,我们追求的更多的是加载更快,体验更好,这时候我们会将代码中的空格注释去掉,对代码进行混淆压缩,只为了让 ...

  2. VUE+webpack+npm项目中的RSA加解密

    一.安装jsencrypt npm i jsencrypt node_modules文件夹中出现jsencrypt 二.引入jsencrypt 在main.js中import: import JsEn ...

  3. Vue项目中的RSA加解密

    前后端使用rsa加密:  一般是客户端初始化时访问登录服务时,服务端面动态生成一对RSA对,公钥传给客户端,客户端拿到后,用户输入密码后,点登录时用公钥加密返回给服务端,服务端用私钥解就行了 一.安装 ...

  4. 在webpack搭建的vue项目中如何管理好后台接口地址

    在最近做的vue项目中,使用了webpack打包工具,以前在做项目中测试环境和生产环境的接口地址都是一样的,由于现在接口地址不一样,需要在项目打包的时候手动切换不同的地址,有时候忘记切换就要重新打包, ...

  5. 彻底删除 Git 项目中的文件(BFG Repo-Cleaner 用法)

    一些时候由于开发初期经验不足和贪图方便, 会把一些不应该提交到 Git 的文件上传到 Github, 带来一系列安全问题, 更有可能是把一些大文件上传到 GitHub 上, 导致项目非常臃肿, 每次 ...

  6. web报表工具Stimulsoft Reports.Web在mvc项目中使用

    Stimulsoft Reports.Web,是一款可以直接在Web中编辑报表的报表工具 web项目技术框架mvc4+easyui+knockoutjs 1.在项目中添加引用 Stimulsoft.B ...

  7. iOS开发小技巧--微博项目中的键盘工具条

    微博项目中的键盘工具条 项目中的键盘工具条不能使用inputAccessoryView,因为inputAccessoryView不能实现键盘隐藏的时候,工具条还显示在眼前,如图: 所以,果断决定将工具 ...

  8. 如何在MVC_WebAPI项目中的APIController帮助页面添加Web测试工具测试

    本文转载自:http://www.cnblogs.com/pmars/p/3673811.html 先看效果图: 以下是原文: 如何在帮助页面添加测试工具 上一篇我在ASP.NET里面添加了一个Hel ...

  9. Mac笔记本中是用Idea开发工具在Java项目中调用python脚本遇到的环境变量问题解决

    问题描述: mac笔记本本身会自带几个python版本,比如python2.7版本,我没有改动mac默认的python版本,只是安装了python3.7版本. 使用Pycharm开发Python项目没 ...

随机推荐

  1. Android典型界面设计(3)——访网易新闻实现双导航tab切换

    一.问题描述 双导航tab切换(底部区块+区域内头部导航),实现方案底部区域使用FragmentTabHost+Fragment, 区域内头部导航使用ViewPager+Fragment,可在之前博客 ...

  2. 这些年我在技术路上做过最虚伪愚蠢的事情,就是在CSDN上刷屏赚分

    现在似乎Github成了所谓技术人士的新宠,之前是博客,更早则是论坛. CSDN是众多技术论坛里比较突出的一个,人多高手也多,很多问题都能得到满意的回答. 谁都希望自己卓尔不群,我也不例外,我也想像那 ...

  3. 三种方法教你如何用PHP模拟post提交数据

    php模拟post传值在日常的工作中用到的不是很多,但是在某些特定的场合还是经常用到的. 下面,我整理了三种php模拟post传值的方法,file_get_contents.curl和socket. ...

  4. Java 8 学习资料汇总【转载】

    原文地址 2014年3月18日,Java SE 8 发布,而 Java 9 预期2016年发布: 2011年7月7日,Java 7 发布,是2009年4月20日被Oracle 以74亿美元收购首次推出 ...

  5. js获取客户端time,cookie,url,ip,refer,user_agent信息:

    <script src="http://pv.sohu.com/cityjson?ie=utf-8"></script> <script type=& ...

  6. expdp ORA-39070:Unable to open the log file

    Oracle中,当执行expdp或impdp的时候,有时候会出现错误: [oracle@bi-dw ~]$ expdp dp_user/dp_password@dw directory=expdp_d ...

  7. elasticsearch日志删除命令

    通过curl发送DELETE命令给elasticsearch服务器,进行日志删除操作.命令示例如下: curl -XDELETE *' curl -XDELETE 'http://192.168.10 ...

  8. 深入理解JS执行细节(写的很精辟)

    来源于:http://www.cnblogs.com/onepixel/p/5090799.html javascript从定义到执行,JS引擎在实现层做了很多初始化工作,因此在学习JS引擎工作机制之 ...

  9. 茗洋Easy UI 1.3.5 部分问题解决系列专题[自定义alert关闭时间,自动关]

    [评论,楼层数为30的倍数的,我送你我自己的博客园的皮肤,该博客参与活动] 这次我又给大家带来的EasyUI的我研究拓展的新特性 我使用的是  EasyUI 1.3.5版本的,项目是ASP.NET M ...

  10. 2.翻译系列:为EF Code-First设置开发环境(EF 6 Code-First系列)

    原文链接:http://www.entityframeworktutorial.net/code-first/setup-entity-framework-code-first-environment ...