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. python使用openpyxl操作excel总结

    安装openpyxl pip install openpyxl 简单示例 from openpyxl import Workbook #创建一个工作薄对象,也就是创建一个excel文档 wb = Wo ...

  2. 易初大数据 2019年11月13日 Linux 王庆超

    ★安装Red Hat Enterprise Linux7.41 ◆1通过键盘的方向键选择“lnstall Red Hat Enterprise Linux7.4”选项来直接安装Linux 系统. ◆2 ...

  3. ValueError: zero-size array to reduction operation maximum which has no identity

    数据打印到第530行之后出现以下异常,求解!

  4. MySQL-配置环境变量及修改密码(附-mysql安装教程)

    MySQL-配置环境变量和修改密码 mysql的安装教程:链接:https://pan.baidu.com/s/1rrPT2X0yRF58kN8jZZx-Mg 密码:55dh 一. 闪退问题 1.1. ...

  5. 高德地图3D菱形 区域点击搜索

    更新一波吧 <!doctype html> <html lang="zh-CN"> <head> <!-- 原始地址://webapi.a ...

  6. JavaScript 弹出框:警告(alert)、确认(confirm)的简单写法

    onclick="javascript:return window.confirm('message')"

  7. MathType转Word公式(OMML)

    背景 由于之前个人喜欢在Word里做笔记,而有很多笔记里存在着大量的公式.在早期,由于对Word自身的公式的不理解,所以便使用了MathType这个工具来编写公式.但是现在本人已经转战到LatTeX了 ...

  8. sparkSQL 简介

    一.Spark SQL的特点 1.支持多种数据源:Hive.RDD.Parquet.JSON.JDBC等.2.多种性能优化技术:in-memory columnar storage.byte-code ...

  9. javascript 使用 setInterval 实现倒计时

    javascript 使用 setInterval 实现倒计时 var timer = setInterval(function () { console.log(valid_time); if (v ...

  10. Java实现AES加密解密

    之前常用两种加密算法:Base64和Md5,前者容易破解,后者不可逆. AES采用对称加密方式,破解难度非常大,在可逆的基础上,能很好的保证数据的安全性. 这里介绍Java中实现AES加密算法的加密与 ...