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命令

  1. 运行adb reverse tcp:8081 tcp:8081
  2. 不需要更多配置,你就可以使用Reload JS和其它的开发选项了。

3.2 (Android 5.0以下)通过Wi-Fi连接你的本地开发服务器

  1. 首先确保你的电脑和手机设备在同一个Wi-Fi环境下。
  2. 在设备上运行你的React Native应用。和打开其它App一样操作。
  3. 你应该会看到一个“红屏”错误提示。这是正常的,下面的步骤会解决这个报错。
  4. 摇晃设备,或者运行adb shell input keyevent 82,可以打开开发者菜单。
  5. 点击进入Dev Settings
  6. 点击Debug server host for device
  7. 输入你电脑的IP地址和端口号(电脑网络IP:8081)。查看电脑IP这里就不用多说啦。
  8. 回到开发者菜单然后选择Reload JS。

备注:理想状态下已经可以看到APP页面了,但是,如果上面步骤都已经做好,并且电脑本地服务终端已显示加载成功,但是APP的页面还未加载出来,显示白屏状态!是我们的步骤有问题?这里并不是我们的步骤有问题,此时只需要退出正在运行的APP,重新打开即可,就可以成功加载到APP页面啦!

React-Native项目在Android真机上调试的更多相关文章

  1. 关于React Native项目在android上UI性能调试实践

    我们尽最大的努力来争取使UI组件的性能如丝般顺滑,但有的时候这根本不可能做到.要知道,Android有超过一万种不同型号的手机,而在框架底层进行软件渲染的时候是统一处理的,这意味着你没办法像iOS那样 ...

  2. Charles学习(四)之使用Map local代理本地静态资源以及配置移动端代理在真机上调试iOS和Android客户端

    前言 问题一:我们在App内嵌H5开发的过程中,肯定会遇到一个问题就是我不想在chrome的控制台中调试也不想在模拟器中调试,我想要在真机上调试,那么如何解决这个问题呢? 问题二:我们期待调试时达到的 ...

  3. 安装android Studio和运行react native项目(基础篇)

    ANDROID_HOME环境变量 确保ANDROID_HOME环境变量正确地指向了你安装的Android SDK的路径. 打开控制面板 -> 系统和安全 -> 系统 -> 高级系统设 ...

  4. 如何在真机上调试Android应用程序(图文详解)(zz)

    http://www.cnblogs.com/lanxuezaipiao/archive/2013/03/11/2953564.html   1.首先将手机设置为调试模式 方法:设置——应用程序——开 ...

  5. 【React Native开发】React Native应用设备执行(Running)以及调试(Debugging)(3)

    ),React Native技术交流4群(458982758),请不要反复加群.欢迎各位大牛,React Native技术爱好者加入交流!同一时候博客左側欢迎微信扫描关注订阅号,移动技术干货,精彩文章 ...

  6. 【腾讯Bugly干货分享】React Native项目实战总结

    本文来自于腾讯bugly开发者社区,非经作者同意,请勿转载,原文地址:http://dev.qq.com/topic/577e16a7640ad7b4682c64a7 “8小时内拼工作,8小时外拼成长 ...

  7. Expo大作战(三)--针对已经开发过react native项目开发人员有针对性的介绍了expo,expo的局限性,开发时项目选型注意点等

    简要:本系列文章讲会对expo进行全面的介绍,本人从2017年6月份接触expo以来,对expo的研究断断续续,一路走来将近10个月,废话不多说,接下来你看到内容,讲全部来与官网 我猜去全部机翻+个人 ...

  8. eros --- Windows Android真机调试

    1.下载并安装JDK 2.下载并安装Android Studio 上面两项不管用weex还是eros都是前置条件,度娘有大量教程. 开始eros 手脚架安装: $ npm i -g eros-cli ...

  9. React Native 项目运行在 Web 浏览器上面

    React Native 的出现,让前端工程师拥有了使用 JavaScript 编写原生 APP 的能力.相比之前的 Web app 来说,对于性能和用户体验提升了非常多. 但是 React Nati ...

随机推荐

  1. Golang 基础学习笔记(2)| 如何安装Go工具

    可参考官网:http://docscn.studygolang.com/doc/install#安装 1.OS要求 gc 编译器支持以下操作系统及架构.在开始前,请确保你的系统满足这些需求. 若你的O ...

  2. layui多级弹框去掉遮罩

    var index = layer.open({ type:1, title:'请选择费用代码', area:['1050px','650px'], content:$('#selectFee'), ...

  3. zookeeper集群模式安装

    服务器节点规划: 节点1:192.168.0.103 节点2:192.168.0.104 节点3:192.168.0.105 安装zookeeper,将zookeeper上传到三个服务器,保存在/ho ...

  4. EFK教程 - ElasticSearch高性能高可用架构

    通过将elasticsearch的data.ingest.master角色进行分离,搭建起高性能+高可用的ES架构 作者:"发颠的小狼",欢迎转载与投稿 目录 ▪ 用途 ▪ 架构 ...

  5. 008.Kubernetes二进制部署Nginx实现高可用

    一 Nginx代理实现kube-apiserver高可用 1.1 Nginx实现高可用 基于 nginx 代理的 kube-apiserver 高可用方案. 控制节点的 kube-controller ...

  6. Docker学习-Docker搭建Consul集群

    1.环境准备 Linux机器三台 网络互通配置可以参考 https://www.cnblogs.com/woxpp/p/11858257.html 192.168.50.21 192.168.50.2 ...

  7. T-SQL Part XI: Login Failed 18456 以及修改Authentication Mode

    这是一个很常见的场景,安装SQL Server时候选择了默认的Windows Authentication Only,然后使用中发现还是需要支持用户名/密码登录. 按照MSDN的文档,然而并没有多大作 ...

  8. java编程思想第四版第十八章总结

    一.概述 如何学习java I/O 学习I/O类库 学习I/O发展史,为什么要学习发展史呢? 因为,如果缺乏发展史,我们就会对什么时候使用哪个类,以及什么时候不该使用它们而感到迷惑. 了解nio 二. ...

  9. 自建yum仓库,该仓库为默认仓库

    YUM REPO: http://content.example.com/rhel7.0/x86_64/dvd 创建自建yum REPO文件: vim /etc/yum.repos.d/redhat. ...

  10. 小白学 Python 爬虫(2):前置准备(一)基本类库的安装

    人生苦短,我用 Python 前文传送门: 小白学 Python 爬虫(1):开篇 本篇内容较长,各位同学可以先收藏后再看~~ 在开始讲爬虫之前,还是先把环境搞搞好,工欲善其事必先利其器嘛~~~ 本篇 ...