移动端调试利器-vConsole】的更多相关文章

现在移动端开发越来越火,随之而来的问题也越来越多,今天给大家介绍一款移动端调试神器,vconsole. 一.先引用文件,可以从https://www.bootcdn.cn/vConsole/下载,也可以下载保存在本地,直接引用 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>demo.html</title> <script src=&q…
移动端调试神器vconsole,手机端网页的调试工具Eruda 移动端中使用 vConsole调试 移动端调试工具vconsole安装Git地址:https://github.com/WechatFE/vConsolevConsole是一款由微信公众平台前端团队打造的前端调试面板,专治手机端看log难题.目前vConsole自带有2个面板,默认为“日志”面板,负责展示log. 项目开发时经常需要debug调试,但在移动端debug则会阻断代码运行,并且很难判断出错在哪里,这里我们需要借助第三方插…
先看这篇文章 Web应用调试:现在是Weinre和JSConsole,最终会是WebKit的远程调试协议. 我们先不看未来,从此文可见,当下的移动端调试还是 Weinre 和 JSConsole 的天下.Weinre 我们在前面已经有所了解(详见 移动端页面(css)调试之"weinre大法"),它主要是为了移动端 css 的调试,能兼容各种浏览器,支持 css 修改,且不用刷新就能在移动端看到效果.今天我们来了解下另一种利器 -- JSConsole. 移动端的调试最蛋疼的恐怕就是想…
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'); &l…
记录一些小零碎知识点,以便日后查看~ 1.随机撒花特效 教师节快到了,公司的产品提出一个需求:在IM(即时聊天)聊天界面弹出教师节的祝福“广告”,用户点击“发送祝福”按钮,聊天界面会随机撒花.这里的重点是随机撒花,下面会附上随机撒花的代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"> <html xmlns="http://www.w3.org/1999/xhtml"…
图示: ,  简单的几步操作: 1. 引入cdn     可以从https://www.bootcdn.cn/vConsole/下载,也可以下载保存在本地,直接引用 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>demo.html</title> <script src="https://cdn.bootcdn.net/aja…
vConsole:一个轻量.可拓展.针对手机网页的前端开发者调试面板,主要还是用于内嵌app页面时在手机上进行调试,打印完全和在PC端一样,方便大家找出问题所在. 不说废话直接进入主题,vConsole.js最新下载地址. 直接将vConsole.js引入项目中,需要注意的是:最好吧js引入到页面的最上边.这样刚页面会首先加载vConsole.js. <script src="path/to/vconsole.min.js"></script> <scri…
什么是vConsole?   官方说明是一个web前端开发者面板,可用于展示console日志,方便日常开发,调试. 简单来说相当于移动版的Chrome调试控制台,就是我们在PC端常用的F12 vConsole的使用场景? 比如测试妹纸拿着手机过来跟你说某个页面打不开.你心想,怎么可能,我在电脑上用Chrome调试得好好的,也没有报错啊. 然后你接过测试妹纸的手机发现确实有个页面打不开.问题来了,移动端又不能像PC端打开控制台调试,我要怎么排错呢? vConsole就运应而生了 vConsole…
我们在开发手机版网页的时候,常常会出现下面的情景: (1) 开发时,在自己电脑上运行得好好的,在手机上打开就挂了,但是手机上又看不到error log: (2) 上线后,某用户表示页面失灵,但我们自己又重现不出来,看不到用户侧的出错信息. 如果说(1)还可以通过电脑连接手机以查看log来解决,那(2)在没有完善的前端上报体系时就非常被动了. 作为开发者,我们的诉求很简单:有没有快捷的方法在手机前端页面看到log日志? 答案是肯定的. vConsole:一个轻量.可拓展.针对手机网页的前端开发者调…
最近因为做抽奖页面,在android上可以使用手机连上电脑后用chrome浏览器chrome://inspect进行页面探测,但是ios中的页面就不能这样探测 在网上搜索后发现此插件,大大解决了问题 使用方法: 1.必须将vconsole.min.js放到<head>中 2.使用new vConsole()将控制台嵌入到页面中,便于随时观察数据变化 参考: https://www.w3cways.com/2038.html…
参考 使用方法 移动端真机debug调试神器 vConsole的引入说明(原生态与WebPack) 移动端使用vconsole调试console vConsole ——开源的前端 console 调试面板 下载地址 Github BootCDN…
手机H5 web调试利器--WEINRE (WEb INspector REmote) 调试移动端页面,优先选择使用chrome浏览器调试,如果是hybrid形式的页面,可以使用chrome提供的chrome://inspect/#devices 安卓真机调试,不过这个要求比较高: 首先,你的 Chrome 版本必须高于 32 其次你的测试机 Android 系统高于 4.0, 再其次,测试机安装 Chrome for Android 才可以使用 Chrome 远程调试这项功能, 最后, 手机需…
转自:http协议调试利器fiddler使用教程http://bbs.phpchina.com/thread-207418-1-1.html Fiddler真乃神器!它和市面上常见的很多web调试器.http调试器.sniffer都不同!它的原理是在浏览器(或者其他使用http协议的进程)和服务器之间做代理角色,这样所有的通信都要经过它,尽管sniffer和这个原理是一样的,但他们工作的网络层不同. 看上图,你就明白原理了咯,它以8888端口(多么吉利的数字呀!)开本地代理服务器,并且支持htt…
最近在改一个移动端项目,在手机上调试贼头疼,什么日志都看不到,分析不了bug问题. 然后我同事给我介绍了一个移动端的调试神器 -- vconsole 有了这个神器,领导再也不用担心我的工作啦!!! 0.0 怎么使用VConsole呢? 超简单的,只需要2步 第一步: 在页面引入vconsole的cdn: https://cdn.bootcss.com/vConsole/3.3.0/vconsole.min.js 或者是下载下来 还可以安装依赖 npm install  vconsole,请根据自…
Remote File Explorer是一个跨平台的远程文件浏览器,用户通过Unity Editor就能操作运行在手机上的游戏或是应用的的目录文件.比如当项目打包运行到设备上时,可通过Remote File Explorer直接浏览设备上的目录文件,并进行下载,上传,删除等操作.尤其是Unity+Lua开发环境下的调试利器,当然,这里的调试不是指代码的逐行调试,而是泛指定位排查问题 用武之地 在很多场景下利用Remote File Explorer都可以极大的提高开发调试效率.例如: 应用真机…
Reveal1.0.7破解 1.官网下载最新版Reveal,拖动应用程序中,运行一次2.下载16进制编辑器"0xED" for mac(http://dl.vmall.com/c0kjm4b8fu)3.使用"0xED"打开文件"Macintosh HD ▸ 应用程序 ▸ Reveal ▸ Contents ▸ MacOS ▸ Reveal"4."0xED"菜单栏的Edit 中,Number mode 选择 Hex5.搜索tex…
Windows GUI代码与Windows消息问题调试利器 记得很久前有这么一种说法: 人类区别于动物的标准就是工具的使用.同样在软件开发这个行业里面,对于工具的使用也是高手和入门级选手的主要区别,高手往往靠工具的使用在关键的时候打开局面,在适当的时候使用适当的工具就往往可以事半功倍. 首先让我们来讨论如下两个简单的问题. 1. 如果你写的一个软件出了一个问题,这个问题只有在关闭程序的时候出现,你怎么调试呢?2. 如果你写的一个软件出了一个问题,这个问题只有在关闭机器的时候出现,你怎么调试呢?3…
最近发现了一个移动端调试的新技能,这里简单描述一下基本情况. 移动端调试常遇到的问题 手机访问只能看到页面的展现,除此之外看不到任何其他信息 无法像调试PC页面那么方便的查看js.dom.network.cookie.storage等信息 js调试只能通过alert来提示了,当然经验丰富的开发者,会制作一个简单的调试信息展示页面,相当于控制台的功能. debuggap简介 run easily and debug powerfully 无需安装,就可以在windows.linux和mac上运行…
Javascript 调试利器 Firebug使用详解 有时候,为了更清楚方便的查看输出信息,我们可能需要将一些调试信息进行分组输出,那么可以使用console.group来对信息进行分组,在组信息输出完成后用console.groupEnd结束分组. 我们测试一下把刚才的4个输出作为一个分组输出,修改代码为: 复制代码 代码如下: console.group('开始分组:'); console.debug('This is console.debug!'); console.info('Thi…
linux-c/c++调试利器gdb.ddd小试 原文链接: http://deepfuture.iteye.com/blog/749148 博客分类: C++/C/lisp CC++C#LinuxUbuntu  一.gdb,在shell窗口调试 main.c内容: main.c #include <stdio.h> int main() { int y=0; for (int i=0;i<10;i++){ y+=i; } return 0; } 深未来技术原创文章,如转载,请注明来源h…
记:今天调试时出现的一个PC端调试运行正常,但打包apk文件后在手机上点击闪退的问题. 可能在不同的情况条件下,会有不同的原因导致apk安装后闪退问题.拿android studio等软件来说,开发安卓程序时会有日志log文件包含生成错误信息等,但是cocos2dx开发在命令行里编译apk,意外的错误缘由难以直面地展现给我们. 闪退的大致问题都殊途同归:资源的加载出现问题. 我今天出现这个问题之后,进行了一些尝试,在解决问题的过程当中,大致操作如下: 1.将Resources资源文件夹下的全部目…
此处记录一下踩过的坑 之前看的这个地址:http://www.browsersync.cn/ 也就是 BrowserSync的官网上面关于代理服务器的例子不管怎么试都不行 请看下例子 browser-sync start --proxy "主机名" "css/*.css"而实际上不管怎么试都不行在git bash here 和cmd 中试了一下结果是都不行,具体情况是可以将本地服务器的地址代理到localhost:3000或者localhost:3001但是一直不能…
一.概述 有一个项目需要在手机端显示一个 web 页面,而每次把应用 launch 后,从手机端看比较麻烦,因此搜罗了几种在 PC 端调试手机端页面的工具. 二.工具 http://fonkie.iteye.com/blog/1846858 http://blog.csdn.net/dojotoolkit/article/details/6280924…
dubbo服务接口开发者必备调试利器,你值得拥有 学习了:https://my.oschina.net/vboxtop/blog/1524290 找到了:http://www.vbox.top/?from=oschina…
1. gdb 调试利器 GDB是一个由GNU开源组织公布的.UNIX/LINUX操作系统下的.基于命令行的.功能强大的程序调试工具.对于一名Linux下工作的c++程序猿,gdb是不可缺少的工具: 1.1. 启动gdb 对C/C++程序的调试.须要在编译前就加上-g选项: $g++ -g hello.cpp -o hello 调试可运行文件: $gdb <program> program也就是你的运行文件.一般在当前文件夹下. 调试core文件(core是程序非法运行后core dump后产生…
简述 Fiddler是一个http协议调试代理工具,它能够记录并检查所有你的电脑和互联网之间的http通讯,设置断点,查看所有的"进出"Fiddler的数据(指cookie.html.js.css等文件,这些都可以让你胡乱修改的意思).Fiddler要比其他的网络调试器要更加简单,因为它不仅仅暴露http通讯还提供了一个用户友好的格式. 简述 介绍 工作原理 同类产品 使用简介 更多参考 介绍 Fiddler是用C#写的,它包含一个简单却功能强大的基于JScript .NET事件脚本子…
html5 微信真机调试方法 vConsolehttps://blog.csdn.net/weixin_36934930/article/details/79870240…
移动端调试Web页面 虽然可以在PC下,通过开发者工具,模拟移动端,但是这样只能模拟页面样式,对于代码的执行情况是无法模拟的,所以在此结合实际调试经验,针对安卓与IOS设备,进行总结. IOS 安卓 IOS 软件准备 Node.js Scoop Remotedebug-ios-webkit-adapter 说明: Scoop是一款Windows下命令行包管理工具 Scoop安装完后,通过它下载 ios-webkit-debug-proxy 安装Node模块:remotedebug-ios-web…
Docs 开发之 Charles 配置指南 1.下载与安装 charles-proxy-4.1.4 .dmg56.12 MB已存到云盘下载 2.激活 使用公司正版license 激活 安装证书 点击证书并选择「始终信任」 (证书不被信任可能会导致网站开发时部分资源文件无法加载.) 设置代理 将你需要代理HTTPS的网站添加进去: 本地调试 如果你想代理bear-test 到本地, 你需要: 点击Map Remote: 添加你需要的设置: 这里提供一个基础配置: bear-test_example…
说明 由于移动端项目在手机中调试时不能使用chrome的控制台,而vconsole是对pc端console的改写 使用方法 使用 npm 安装: npm install vconsole 使用webpack,然后js代码中: import VConsole from 'vconsole/dist/vconsole.min.js' //import vconsole let vConsole = new VConsole() // 初始化 或者找到这个模块下面的 dist/vconsole.min…