最近开始接触rn,官方起手,装了一堆工具,然后启动项目的时候出现了一堆问题,这里针对我遇到的一些问题提供一些解决方案。

本人开发环境mac,在启动ios的时候没啥大问题,可以直接启动,这里提示一点,因为可能会启动多个,所以可以在启动的时候指定端口,防止冲突react-native run-ios --port=xxxx

但是在启动安卓的时候出现了一堆问题,一开始使用命令react-native run-android --port=xxxx的时候,命令行报错

$ react-native run-android
Scanning folders for symlinks in /Users/ric/myprojs/albums/node_modules (6ms)
Starting JS server...
Building and installing the app on the device (cd android && ./gradlew installDebug)... FAILURE: Build failed with an exception. * What went wrong:
Could not determine java version from '9.0.4'. * Try:
Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output.
Could not install the app on the device, read the error above for details.
Make sure you have an Android emulator running or a device connected and have
set up your Android development environment:
https://facebook.github.io/react-native/docs/android-setup.html

无法判断java版本,这里查找了一些资料,只要把jdk换成1.8就可以了,我们这里可以装多个版本jdk,然后配置环境变量,动态切换版本即可。

在根目录下创建.bash_profile文件,添加内容并保存

#设置sdk路径
export PATH=${PATH}:/Users/stevenzwzhai/Library/Android/sdk/platform-tools/:/Applications/Android\ Studio.app/sdk/platform-tools
#设置idk 8
export JAVA_8_HOME=`/usr/libexec/java_home -v 1.8.0`
#设置 JDK 9
export JAVA_9_HOME=`/usr/libexec/java_home -v 9.0.4`
#默认JDK 9
export JAVA_HOME=$JAVA_9_HOME
#alias命令动态切换JDK版本
alias jdk8="export JAVA_HOME=$JAVA_8_HOME"
alias jdk9="export JAVA_HOME=$JAVA_9_HOME"

source .bash_profile配置立即生效。

然后我们切换jdk版本,命令行直接jdk8即可,继续运行上面的命令,如果报错显示sdk找不到,那么可以在项目的android目录下创建文件local.properties并保存下面内容

sdk.dir = /Users/stevenzwzhai/Library/Android/sdk

接着我们再次运行命令,这次不报错了,但是安卓模拟器红屏,显示

unable to load script from assets 'index.android.bundle'.Make sure your bundle ispackged correctly or you are running a packger server.

这里,有一些其他人的解决办法

1.在android\app\src\main下新建assets文件

2.在项目根目录下执行react-native bundle --platform android --dev false --entry-file index.android.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res

3.重新执行react-native run-android

但是我这里使用却没有效果,所以我的应该是端口问题,我发现安卓在启动程序的时候头部显示,10.0.x.x:8081,因为默认是端口8081,但是我们启动的时候手动设置成了别的端口,这里就需要修改模拟器的代理,ip还是手机的ip,注意不是打开wifi那里显示的ip,而是模拟器启动我们项目时头部一条绿色的框框里的那个,只要reload那个框框就会显示,然后把端口改成你启动项目时的端口就可以了。

这样我们就可以不用启动Android studio或者Xcode来启动项目了。

react-native android 初始化问题的更多相关文章

  1. react-native —— 在Windows下搭建React Native Android开发环境

    在Windows下搭建React Native Android开发环境 前段时间在开发者头条收藏了 @天地之灵_邓鋆 分享的<在Windows下搭建React Native Android开发环 ...

  2. React Native Android原生模块开发实战|教程|心得|怎样创建React Native Android原生模块

    尊重版权,未经授权不得转载 本文出自:贾鹏辉的技术博客(http://blog.csdn.net/fengyuzhengfan/article/details/54691503) 告诉大家一个好消息. ...

  3. React Native Android启动白屏的一种解决方案上

    我们用RN去开发Android应用的时候,我们会发现一个很明显的问题,这个问题就是启动时每次都会有1~3秒的白屏时间,直到项目加载出来 为什么会出现这个问题? RN开发的应用在启动时,首先会将js b ...

  4. react native android 编译

    修改 Maven 仓库地址 React Native 在初始化时会从 jcenter.binary.com 这个地方下载一些东西,网上搜索了一下,好像是在下载 Maven 相关的依赖. 针对全局进行修 ...

  5. React Native Android 环境搭建

    因为工作需要,最近正在学习React Native Android.温故而知新,把学习的内容记录下来巩固一下知识,也给有需要的人一些帮助. 需要说明的是,我刚接触React Native也不久,对它的 ...

  6. React native android 最常见的10个问题

    这里逐条记录下最容易遇到的React native android 相关case: 1. app启动后,红色界面,unable load jsbundle : 解决办法:一般来说就是,你是用dev-s ...

  7. react-native —— 在Mac上配置React Native Android开发环境排坑总结

    配置React Native Android开发环境总结 1.卸载Android Studio,在终端(terminal)执行以下命令: rm -Rf /Applications/Android\ S ...

  8. React Native & Android & iOS & APK

    React Native & Android & iOS & APK https://play.google.com/apps/publish/signup/ $ 25 bui ...

  9. Windows 10 & React Native & Android

    Windows 10 & React Native & Android https://facebook.github.io/react-native/docs/getting-sta ...

  10. React Native & Android & iOS

    React Native & Android & iOS React Native & Android & iOS https://facebook.github.io ...

随机推荐

  1. 动量法应用NASA测试不同飞机机翼噪音

    %matplotlib inline from mxnet import nd import numpy as np from mxnet import autograd,gluon,init,nd ...

  2. shiro注解,初始化资源和权限,会话管理

     有具体问题的可以参考之前的关于shiro的博文,关于shiro的博文均是一次工程的内容  注解: 新建一个类: 此时需要有admin的权限才可以执行下面的代码 public class ShiroS ...

  3. js 实现 文字打印效果

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  4. 【题解】洛谷P2661 [NOIP2015TG] 信息传递

    题目来源:洛谷P2661 思路 运用并查集查找图中最小环的长度 如果A传递信息给B 就从A加一条边指向B 并更新A的父节点 从A到父节点的路径长度为B到父节点的路径长度+1 如果有两个点的祖先相同而且 ...

  5. 【转载】iPhone屏幕尺寸、分辨率及适配

    iPhone屏幕尺寸.分辨率及适配 转载http://m.blog.csdn.net/article/details?id=42174937 1.iPhone尺寸规格 iPhone 整机宽度Width ...

  6. PCB 布线 注意哪些问题记录

    1.过孔不能打在焊盘上 ,这样 焊接的时候 会有焊锡 溢出导致 短路. 2.焊盘的线引出时应该从中间引出,不应该从角落引出 3.当有较粗的电源线连接在元器件上时,最好是 有一根小线连接在元器件上,回流 ...

  7. Vue教程:指令与事件(二)

    一.插值 v-once 通过使用 v-once 指令,你也能执行一次性地插值,当数据改变时,插值处的内容不会更新.但请留心这会影响到该节点上所有的数据绑定: span v-once>这个将不会改 ...

  8. 从tomcat下载文件的配置方法(很全呢)

    前几天我做的项目有个下载文件的东西让我苦恼了一下,上传的文件没有放到OSS服务器,而是直接放到tomcat内, 我就想做一个a标签直接下载的得了,结果点开一直都说没有该文件,我查了很多资料找到了如何配 ...

  9. Webstorm新建vue类型文件设置

    今天安装了Node.js,配置了vue需要的框架,发现原有的wenstorm新建文件的时候没有vue文件选项,因此,学习了一下webstorm如何配置创建vue文件 具体过程如下: 第一步,打开web ...

  10. 纯js轮播图练习-3,类似于淘宝海报带小圆点轮播图

    基于js和css,跟着网上的视频教程,结合自己想要的效果,做出了一个类似于淘宝海报的效果. 如图:淘宝首页 自己做的: 代码: <!DOCTYPE html> <html> & ...