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 ...
随机推荐
- PyCharm使用正则替换python中的静态资源
python每次开发前台页面时,最无法避免的就是前台静态资源地址的替换了,手动替换成{% static 'web/.......' %}可想而知的痛苦,把正则替换的方式分享给朋友们,希望可以帮助到需要 ...
- Hibernate中关于Query返回查询结果是类名的问题
query.list返回的是一个装有类的信息的集合,而不装有数据库信息的集合.如下图 运行结果为: 因为得到的集合是类,所以要将list泛型设为那个类,并且将得到的集合进行.get(x).getx ...
- Java传参-基本数据类型和引用数据类型作为参数的区别(值传递)
java中的方法可以传递参数,参数的传递方法就是值传递. 参数有形参和实参,定义方法时写的参数叫形参,真正调用方法时,传递的参数叫实参. 调用方法时,会把实参传递给形参,方法内部其实是在使用形参. 所 ...
- Linux下mysql的主从复制配置
1.准备两台数据库环境,或者单台多实例环境,能正常启动和登录. 数据库的安装和多实例配置请参考https://www.cnblogs.com/qiuhom-1874/p/9757061.html. 2 ...
- CentOS 6.4 configure error的解决方法
资料来源:http://blog.sina.com.cn/s/blog_62426dcf0100f2rz.html 虽然上面的文章是针对centOS 5写的,不过经测试也可用于centOS6.4. 自 ...
- ios input输入不了
在项目中遇到了一个问题就是input输入框在安卓可以输入,而在ios输入不了 经过百度,调试发现,在ios中input默认是有user-select: none;属性把input输入框禁用了,将其删除 ...
- MySQL/MariaDB读写分离配置
DB读写分离描述 数据库的读写分离其实就是为了加减少数据库的压力:数据库的写入操作由主数据库来进行,读取操作由从数据库来进行操作.实现数据库读写分离技术是有很多方法的,在这里我就用一个比较简单的mys ...
- Winform-最大化窗口
设置winform窗体最大化,填满整个屏幕 this.WindowState = FormWindowState.Maximized;
- php使用QueryList轻松采集JavaScript动态渲染页面
QueryList使用jQuery的方式来做采集,拥有丰富的插件. 下面来演示QueryList使用PhantomJS插件抓取JS动态创建的页面内容. 安装 使用Composer安装: 安装Query ...
- Python 编程语言要掌握的技能之一:善用变量来改善代码质量
如何为变量起名 在计算机科学领域,有一句著名的格言(俏皮话): There are only two hard things in Computer Science: cache invalidati ...