react-native android 初始化问题
最近开始接触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 初始化问题的更多相关文章
- react-native —— 在Windows下搭建React Native Android开发环境
在Windows下搭建React Native Android开发环境 前段时间在开发者头条收藏了 @天地之灵_邓鋆 分享的<在Windows下搭建React Native Android开发环 ...
- React Native Android原生模块开发实战|教程|心得|怎样创建React Native Android原生模块
尊重版权,未经授权不得转载 本文出自:贾鹏辉的技术博客(http://blog.csdn.net/fengyuzhengfan/article/details/54691503) 告诉大家一个好消息. ...
- React Native Android启动白屏的一种解决方案上
我们用RN去开发Android应用的时候,我们会发现一个很明显的问题,这个问题就是启动时每次都会有1~3秒的白屏时间,直到项目加载出来 为什么会出现这个问题? RN开发的应用在启动时,首先会将js b ...
- react native android 编译
修改 Maven 仓库地址 React Native 在初始化时会从 jcenter.binary.com 这个地方下载一些东西,网上搜索了一下,好像是在下载 Maven 相关的依赖. 针对全局进行修 ...
- React Native Android 环境搭建
因为工作需要,最近正在学习React Native Android.温故而知新,把学习的内容记录下来巩固一下知识,也给有需要的人一些帮助. 需要说明的是,我刚接触React Native也不久,对它的 ...
- React native android 最常见的10个问题
这里逐条记录下最容易遇到的React native android 相关case: 1. app启动后,红色界面,unable load jsbundle : 解决办法:一般来说就是,你是用dev-s ...
- react-native —— 在Mac上配置React Native Android开发环境排坑总结
配置React Native Android开发环境总结 1.卸载Android Studio,在终端(terminal)执行以下命令: rm -Rf /Applications/Android\ S ...
- React Native & Android & iOS & APK
React Native & Android & iOS & APK https://play.google.com/apps/publish/signup/ $ 25 bui ...
- Windows 10 & React Native & Android
Windows 10 & React Native & Android https://facebook.github.io/react-native/docs/getting-sta ...
- React Native & Android & iOS
React Native & Android & iOS React Native & Android & iOS https://facebook.github.io ...
随机推荐
- 动量法应用NASA测试不同飞机机翼噪音
%matplotlib inline from mxnet import nd import numpy as np from mxnet import autograd,gluon,init,nd ...
- shiro注解,初始化资源和权限,会话管理
有具体问题的可以参考之前的关于shiro的博文,关于shiro的博文均是一次工程的内容 注解: 新建一个类: 此时需要有admin的权限才可以执行下面的代码 public class ShiroS ...
- js 实现 文字打印效果
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 【题解】洛谷P2661 [NOIP2015TG] 信息传递
题目来源:洛谷P2661 思路 运用并查集查找图中最小环的长度 如果A传递信息给B 就从A加一条边指向B 并更新A的父节点 从A到父节点的路径长度为B到父节点的路径长度+1 如果有两个点的祖先相同而且 ...
- 【转载】iPhone屏幕尺寸、分辨率及适配
iPhone屏幕尺寸.分辨率及适配 转载http://m.blog.csdn.net/article/details?id=42174937 1.iPhone尺寸规格 iPhone 整机宽度Width ...
- PCB 布线 注意哪些问题记录
1.过孔不能打在焊盘上 ,这样 焊接的时候 会有焊锡 溢出导致 短路. 2.焊盘的线引出时应该从中间引出,不应该从角落引出 3.当有较粗的电源线连接在元器件上时,最好是 有一根小线连接在元器件上,回流 ...
- Vue教程:指令与事件(二)
一.插值 v-once 通过使用 v-once 指令,你也能执行一次性地插值,当数据改变时,插值处的内容不会更新.但请留心这会影响到该节点上所有的数据绑定: span v-once>这个将不会改 ...
- 从tomcat下载文件的配置方法(很全呢)
前几天我做的项目有个下载文件的东西让我苦恼了一下,上传的文件没有放到OSS服务器,而是直接放到tomcat内, 我就想做一个a标签直接下载的得了,结果点开一直都说没有该文件,我查了很多资料找到了如何配 ...
- Webstorm新建vue类型文件设置
今天安装了Node.js,配置了vue需要的框架,发现原有的wenstorm新建文件的时候没有vue文件选项,因此,学习了一下webstorm如何配置创建vue文件 具体过程如下: 第一步,打开web ...
- 纯js轮播图练习-3,类似于淘宝海报带小圆点轮播图
基于js和css,跟着网上的视频教程,结合自己想要的效果,做出了一个类似于淘宝海报的效果. 如图:淘宝首页 自己做的: 代码: <!DOCTYPE html> <html> & ...