参考 使用方法 移动端真机debug调试神器 vConsole的引入说明(原生态与WebPack) 移动端使用vconsole调试console vConsole ——开源的前端 console 调试面板 下载地址 Github BootCDN…
项目中实际使用 在项目中实际使用的时候发现还是有很多问题的 最初使用方式  <script src="vconsole.min.js"></script>  <script>          // init vConsole          var vConsole = new VConsole();  </script> 问题一:按照文档使用,发现页面引入JS的位置报警告 警告:Cross-Origin Read Blocking…
移动端调试神器vconsole,手机端网页的调试工具Eruda 移动端中使用 vConsole调试 移动端调试工具vconsole安装Git地址:https://github.com/WechatFE/vConsolevConsole是一款由微信公众平台前端团队打造的前端调试面板,专治手机端看log难题.目前vConsole自带有2个面板,默认为“日志”面板,负责展示log. 项目开发时经常需要debug调试,但在移动端debug则会阻断代码运行,并且很难判断出错在哪里,这里我们需要借助第三方插…
总是用模拟器,小破本的渣内存无法承受,同时模拟器的版本大多停在4.4,无法体现Android 5.0.6.0 的版本特性,因此决定利用 Android Studio 的插件实现真机无线调试. 步骤如下: 1. 手机开启 USB 调试模式 :把手机通过 USB 数据线连接到电脑,开启 USB调试,步骤如下:(以MEIZU PRO6 ,flyme5.2.3.0A为例) 将手机连接电脑--->设置--->辅助功能--->开发者选项--->USB调试(打开此选项) 2. 安装 ADB WI…
写在前面 闲来无事,折腾了一下React Native,相比之前,开发体验好了不少.但在真机断点调试那里遇到了跨域资源加载出错的问题,一番探索总算解决,目测是RN新版本调试服务的bug. 遇到类似问题的同学应该不少,这里做下记录,有需要的可以参考下. 如何断点调试 首先,在真机上加载运行RN应用(过程略). 然后,摇动手机,弹出开发菜单,选择"Debug JS Remotely". chrome会自动打开调试界面,地址是 http://localhost:8081/debugger-u…
使用ADB无线连接Android真机进行调试   其实这已经是一个很古老的知识了,记录一下备忘. 准备工作 手机和电脑需要在同一个局域网内 电脑上已经安装好ADB工具,可以是Mac或者Windows 开始 1. 打开手机端口 让手机在指定的端口可以接收到TCP/IP连接. 确保手机开启了usb调试 用usb线把手机和电脑连接起来 执行命令:adb tcpip 5555 执行成功后就可以把usb线拔掉了,端口可以不是5555,这个官方默认使用的. 2. 找到手机的IP地址 一般在 设置-关于手机-…
× 目录 [1]特性 [2]安装 [3]设置[4]移动端 前面的话 chrome的开发者工具可以很好地做好模拟工作,但毕竟模拟和实际还是有差别的.所以,真机测试是一定要做的,如何高效地进行真机测试呢.个人感觉,还是BrowserSync用得比较称手.本文将详细介绍如何应用BrowserSync进行移动端真机测试 特性 BrowserSync能让PC.各移动设备上的页面同时实时地响应文件的更改,而不用刷新操作.而且,当在其他一个设备上进行点击等行为时,该行为也会同步到其他浏览器中 安装 Brows…
1.以前cordova远程调试,Android的直接连接USB后,用chrome打开chrome://inspect网址 IOS的打开Safari的developer下. 这是因为cordova的webView都已经开放了远程调试, 如果是自己的加的webView,要进行远程调试 Android: 在调试WebView需要满足安卓系统版本为Android 4.4+已上.并且需要再你的APP内配置相应的代码,在WebView类中调用静态方法setWebContentsDebuggingEnable…
在近期的移动端开发中,发现浏览器中调试可以正常滚动,而在真机中却不能滚动了,这是为什么呢??? 总结了一下主要有一下两方面:css的设置和js的设置 1.之前有设置css的原因,下面分先说css的问题,主要排查overflow:hidden: 检查也有一定的顺序,检查超出高度的标签是否用了overflow:hidden:最好先检查html或body是不是加了height:100%:overflow:hidden:然后再看包裹在最外边的元素是否加了overflow:hidden; 2.js,因为此…
越来越多的移动端开发工作,需要我们有一个好的调试工具,以解决各类真机才会遇到的BUG,最近使用了一款DebugGap 的工具,非常方便,在这里推荐给大家. 官网地址 DebugGap  . 按需求下载自己所需的版本,解压后打开vide.exe文件运行该应用,如图所示.除此之外还需要安装一个vide-plugin-debug-webview插件,在图中的路径点开Plugin Management ,如图二,下载该插件. 下载完成后点击如下图所示图标 配置你要调试的页面地址,如下图 在vide-pl…