移动端调试工具-Debuggap
随着移动互联网的迅速崛起,开发移动应用程序越来越多,但如果在移动端开发应用程序需要调试时,额… 仿佛又回到了IE时代,最方便也只能到处 alert 来调试。目前已经有一款产品可以做到这一点,比如phonegap,但是phonegap的调试问题非常麻烦,不能真正做到有效提高效率。下面将介绍debug工具。这是一款神器,它简单易用的同时又不影响它的强大,它能够:
- 不需要安装即可运行在Windows、Linux和Mac平台上
- 支持各种平台(Android,IOS,WebOS,BlackBerry,Firefox OS,Windows Phone等等)
- 支持所有HTML5框架(比如phonegap)和浏览器
- 支持快速查看元素节点树
- 可以同一时间调试多个设备
- 支持Android设备单步调试,观察变量等等
话不多说,动起来的吧。
1.下载解压
首先到官网根据自己的色板平台下载相应Debuggap,下载完毕后解压即可,无需安装。解压后,目录结构是这样的,其中DebugGap.exe是运行程序,双击即可运行;而client文件夹下存放的是DebugGap.js。
2016/01/25 15:50 <DIR> .
2016/01/25 15:50 <DIR> ..
2015/05/26 22:04 <DIR> client
2015/04/01 22:05 39,340,032 DebugGap.exe
2015/03/29 15:39 860,672 ffmpegsumo.dll
2015/03/29 15:39 9,956,864 icudt.dll
2015/03/29 15:39 102,400 libEGL.dll
2015/03/29 15:39 873,984 libGLESv2.dll
2015/03/29 15:39 4,001,552 nw.pak
2015/03/29 15:39 4,207,616 nwsnapshot.exe
2015/05/26 22:02 231 package.json
2015/03/29 15:39 463 readme.txt
2016/01/26 13:48 <DIR> source9 个文件 59,343,814 字节4 个目录 288,704,741,376 可用字节
2.使用
使用分为三部分:
- 在项目中引入client文件夹下的DebugGap.js文件
- 配置客户端
- 启动debuggap程序
全过程示范:
第一步:新建一个测试页面。为了使我们手机能访问到,我们将测试页面放入xamp搭建的本地服务器中,并在页面中通过<script src="debuggap.js" type="text/javascript"></script>
引入debuggap.js。(为了引用方便我已将debuggap.js拷到与测试页面同一个文件夹下)
第二步:使用手机访问页面,会发现页面上多了个蓝色按钮,点击后进入 config,配置地址为电脑ip地址和自定义的端口(出于偷懒,下面所有的图都是从think2011拷的)
第三步:在电脑上运行 DebugGap.app,接着输入本机IP地址 和 自定义的端口。
点击链接,即可看到以下界面
点击其中一个进入即可调试
如果觉得本文不错的话,帮忙点击下面的推荐哦,谢谢!
>>>>点击阅读原文
转载于:https://www.cnblogs.com/yzg1/p/5160594.html
移动端调试工具-Debuggap相关推荐
- debuggap 调试html,DebugGap-官方版-DebugGap(移动端调试工具)4.2.2-独木成林
debugGap是一款移动端调试工具,只要是webview,就能查看css属性,请求,console等.支持单步调试支持跨平台开发PHP,javascript,css,html等语言完全免费.支持各类 ...
- vue移动端调试工具
当我们在完成项目时,打包给后端上传至服务器发现页面打不开或者各种问题,在某些软件上看不了控制台报错,那么就需要在项目中添加测试工具,来实现在移动端打开控制台进行测试: 1.vue移动端调试工具,在pu ...
- vue3 移动端调试工具vconsole和eruda 及其两种使用方式
tip:eruda和Chrome浏览器的从console台很像,推荐使用 方式一:直接引用eruda 官方镜像:GitHub - liriliri/eruda: Console for mobile ...
- 嘿,兄弟!移动端调试工具Flipper了解一下(下)
内容简介:上期文章讲过关于Flipper在移动端的使用,主要介绍了Android上的使用,本期来讲一下关于iOS上的集成. 传送门:嘿,兄弟!移动端调试工具Flipper了解一下 Objective- ...
- 移动端调试工具vConsole与Eruda
移动端调试工具vconsole与Eruda 1.vconsole 2. Eruda 随着web H5应用的广泛,很多原生软件采用原生+H5混合开发到的模式,对于安卓和IOS原生的app他们有自己的调试 ...
- 移动端调试工具 vconsole、eruda 使用方法
移动端调试工具 vconsole.eruda 使用方法 一.eruda 安装 main.js 二. vconsole 1.salesHome.vue 2.postMessageWithNative.j ...
- eruda 移动端调试工具
移动端调试工具 eruda
- 移动端调试工具weinre的安装、使用与问题
1.准备 安装需要node.js的支持,确保你的windows安装了node,如何安装在此不在赘述.(不要忘了配置环境变量 2.安装 npm install -g weinre 3.运行 weinre ...
- 嘿,兄弟!移动端调试工具Flipper了解一下
内容简介:本文介绍了一个面向移动端开发者的桌面调试平台Flipper,该调试工具功能包含移动端的日志,布局,文件,性能监控等. 什么是Flipper Flipper 是 facebook 开源的一个面 ...
- 工具 · 移动端调试工具:weinre
获取Weinre 在任何的支持 Node.js 环境的系统下通过包管理器(npm)即可安装Weinre npm install -g weinre 使用Weinre进行远程调试 1 启动 Weinre ...
最新文章
- 独家 | 手把手教你用Python进行时间序列分解和预测
- 鸿蒙so系统,鸿蒙手机版JNI实战(JNI开发、SO库生成、SO库使用)
- 牛客网剑指offer编程实践1-10题
- ddr4服务器内存频率_镁光出样DDR5内存;紫光发布P5160系列SSD!
- eclipsejvm内存不足_Eclipse无法调试及编译时内存不足的解决
- IntelliJ IDEA 导入项目后出现非法字符解决方法
- java getidentifier_android – 如何使用getResource.getIdentifier()获取布局?
- android app攻击与防范论文,基于Android平台的应用程序安全保护研究与应用
- 表分析oracle的作用,Oracle中分析表的作用
- 解决Mysql安装之后没有my.ini配置文件问题
- ubuntu离线中文语音识别
- spring5.0之后Log4jConfigListener过期问题
- python random.sample
- spring boot 在fastdfs文件上传大小限制
- 锐龙r77700参数 r7 7700功耗 r7 7700核显性能
- protues 软件介绍
- 增量学习简介(incremental learning)
- matlab文献资料,matlab文献资料查找方法及资源汇总
- 去哪儿cli2项目总结
- 如何把get请求改成post
热门文章
- BOBSLEDDING(一道有趣的贪心题 nyoj309)
- NYOJ 37 动态规划 回文字符串
- 怎样将树的中序遍历的数输入到一个数组中_二叉搜索树的后序遍历序列(剑指offer第三十一天)...
- 蔬菜大棚原理_温室大棚的原理是什么?
- python math数学模块
- php两数相乘,PHP运算符
- 翻译:swift 5初始化 被忽略的Convenience便捷初始化、Required和继承
- 2012年之前Mac Book pro 安装新系统macOS 10.15 Catalina 制作U盘启动盘
- 支持向量机(Support Vector Machine SVM)
- 保密检查usb痕迹清除_MD型卧式多级泵泵轴抱死故障原因分析和检查维修处理