React-Native项目在Android真机上调试
React-Native项目在Android真机上调试?接下来直奔主题,通过USB将手机和电脑连接,打开手机上的USB调试。不通型号的手机可能设置方式不一样,这里具体不在细说……
1、确保你的设备已经成功连接。可以终端输入adb devices
来查看:
$ adb devices
List of devices attached
"Your device Name" device
注意:为避免调试出现其他问题,此处只需有一台设备连接,如果模拟器打开需要关闭模拟器;
2、终端运行npm start
开启本地服务,成功后运行react-native run-android
来在设备上安装并启动应用
应用成果安装后不出意外的话会提示无法连接服务器,如下图:
出现此问题是因为我们未给手机设置访问开发服务地,模拟器是直接访问电脑本地服务,真机则需要我们手动配置了
3、设置设备访问开发服务器
3.1 (Android 5.0及以上)使用adb reverse命令
- 运行
adb reverse tcp:8081 tcp:8081
- 不需要更多配置,你就可以使用Reload JS和其它的开发选项了。
3.2 (Android 5.0以下)通过Wi-Fi连接你的本地开发服务器
- 首先确保你的电脑和手机设备在同一个Wi-Fi环境下。
- 在设备上运行你的React Native应用。和打开其它App一样操作。
- 你应该会看到一个“红屏”错误提示。这是正常的,下面的步骤会解决这个报错。
- 摇晃设备,或者运行
adb shell input keyevent 82
,可以打开开发者菜单。 - 点击进入
Dev Settings
。 - 点击
Debug server host for device
。 - 输入你电脑的IP地址和端口号(电脑网络IP:8081)。查看电脑IP这里就不用多说啦。
- 回到开发者菜单然后选择Reload JS。
备注:理想状态下已经可以看到APP页面了,但是,如果上面步骤都已经做好,并且电脑本地服务终端已显示加载成功,但是APP的页面还未加载出来,显示白屏状态!是我们的步骤有问题?这里并不是我们的步骤有问题,此时只需要退出正在运行的APP,重新打开即可,就可以成功加载到APP页面啦!
React-Native项目在Android真机上调试的更多相关文章
- 关于React Native项目在android上UI性能调试实践
我们尽最大的努力来争取使UI组件的性能如丝般顺滑,但有的时候这根本不可能做到.要知道,Android有超过一万种不同型号的手机,而在框架底层进行软件渲染的时候是统一处理的,这意味着你没办法像iOS那样 ...
- Charles学习(四)之使用Map local代理本地静态资源以及配置移动端代理在真机上调试iOS和Android客户端
前言 问题一:我们在App内嵌H5开发的过程中,肯定会遇到一个问题就是我不想在chrome的控制台中调试也不想在模拟器中调试,我想要在真机上调试,那么如何解决这个问题呢? 问题二:我们期待调试时达到的 ...
- 安装android Studio和运行react native项目(基础篇)
ANDROID_HOME环境变量 确保ANDROID_HOME环境变量正确地指向了你安装的Android SDK的路径. 打开控制面板 -> 系统和安全 -> 系统 -> 高级系统设 ...
- 如何在真机上调试Android应用程序(图文详解)(zz)
http://www.cnblogs.com/lanxuezaipiao/archive/2013/03/11/2953564.html 1.首先将手机设置为调试模式 方法:设置——应用程序——开 ...
- 【React Native开发】React Native应用设备执行(Running)以及调试(Debugging)(3)
),React Native技术交流4群(458982758),请不要反复加群.欢迎各位大牛,React Native技术爱好者加入交流!同一时候博客左側欢迎微信扫描关注订阅号,移动技术干货,精彩文章 ...
- 【腾讯Bugly干货分享】React Native项目实战总结
本文来自于腾讯bugly开发者社区,非经作者同意,请勿转载,原文地址:http://dev.qq.com/topic/577e16a7640ad7b4682c64a7 “8小时内拼工作,8小时外拼成长 ...
- Expo大作战(三)--针对已经开发过react native项目开发人员有针对性的介绍了expo,expo的局限性,开发时项目选型注意点等
简要:本系列文章讲会对expo进行全面的介绍,本人从2017年6月份接触expo以来,对expo的研究断断续续,一路走来将近10个月,废话不多说,接下来你看到内容,讲全部来与官网 我猜去全部机翻+个人 ...
- eros --- Windows Android真机调试
1.下载并安装JDK 2.下载并安装Android Studio 上面两项不管用weex还是eros都是前置条件,度娘有大量教程. 开始eros 手脚架安装: $ npm i -g eros-cli ...
- React Native 项目运行在 Web 浏览器上面
React Native 的出现,让前端工程师拥有了使用 JavaScript 编写原生 APP 的能力.相比之前的 Web app 来说,对于性能和用户体验提升了非常多. 但是 React Nati ...
随机推荐
- Python实现发送邮件代码
代码如下: # -*- coding: utf-8 -*- #!/usr/bin/env python # @Time : 2017/12/22 17:50 # @Desc : # @File : m ...
- 201871010114-李岩松《面向对象程序设计(java)》第八周学习总结
项目 内容 这个作业属于哪个课程 https://www.cnblogs.com/nwnu-daizh/ 这个作业的要求在哪里 https://www.cnblogs.com/nwnu-daizh/p ...
- Github PageHelper 原理解析
任何服务对数据库的日常操作,都离不开增删改查.如果一次查询的纪录很多,那我们必须采用分页的方式.对于一个Springboot项目,访问和查询MySQL数据库,持久化框架可以使用MyBatis,分页工具 ...
- rabittmq详解
交换机(exchange): 声明交换机: Name Durability (消息代理重启后,交换机是否还存在) Auto-delete (当所有与之绑定的消息队列都完成了对此交换机的使用后,删掉它) ...
- 磁盘配额管理disk quotas
条件: a.确保系统内核支持,Linux一般都支持 b.确保分区格式支持,ext2都只持! c.安装有quota软件,centos默认都有! (1)检查内核是否打开磁盘配额支持 [root@cento ...
- ACE框架 基于共享内存的进程间通讯
ACE框架将基于共享内存的进程间通讯功能,如其它IO组件或IPC组件一样,设计成三个组件.流操作组件ACE_MEM_Stream,连接器组件ACE_MEM_Connector,以及接收连接组件ACE_ ...
- 【Oracle】Oracle数据库基本指标查看
目录 1.查看表空间 2.查看用户 3.查看数据库内存 4.查看数据库版本 5.oracle归档情况 6.查看redo log日志位置 7.查看数据库的控制文件 8.查看RMAN的备份情况 9.FRA ...
- Obtaining the backtrace - libunwind
Sometimes when working on a large project, I find it useful to figure out all the places from which ...
- 详解 PHP 中的三大经典模式
单例模式 单例模式的含义: 作为对象的创建模式,单例模式确保某一个类只有一个实例,而且自行实例化并向整个系统全局地提供这个实例.它不会创建实例副本,而是会向单例类内部存储的实例返回一个引用. 单例模式 ...
- PHP创建对象的6种方式
创建对象实例: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 ...