react native android

貌似windowns和Linux下react native android是社区来维护的,暂时看上去不太靠谱,所以用mac先试一试。
按照官方文档来。(http://sentsin.com/web/1120.html 翻译过的也可以参考下。)

1.安装android环境和genymotion模拟器

https://facebook.github.io/react-native/docs/android-setup.html
写的还不错,做安卓开发的这部分当然是没有问题的啦。

2.安装react native

https://facebook.github.io/react-native/docs/getting-started.html#content

$ npm install -g react-native-cli
$ react-native init AwesomeProject

对没做过前端开发的我来说,问题来了,首先npm是啥。

NPM的全称是Node Package Manager,如果你熟悉ruby的gem,Python的PyPL、setuptools,PHP的pear,那么你就知道NPM的作用是什么了。没错,它就是Nodejs的包管理器。Nodejs自身提供了基本的模块。但是在这些基本模块上开发实际应用需要较多的工作。所幸的是笔者执笔此文的时候NPM上已经有了5112个Nodejs库或框架,这些库从各个方面可以帮助Nodejs的开发者完成较为复杂的应用。这些库的数量和活跃也从侧面反映出Nodejs社区的发展是十分神速和活跃的。

2.1安装npm

他的官网
https://www.npmjs.com/
看了半天没找到怎么安装。。。
http://www.cnblogs.com/zhangran/p/3679333.html
这里面说,用homebrew装上Node就可以一起装好npm,还好我装过homebrew,顺便把node一起装了吧。

$ brew install node

用npm命令试一下,OK,果然装好了。

2.2 react-native init

理论上讲执行官网的2条命令,环境就快速搭好了,然而还真不是那么容易。第二步react-native init AwesomeProject果断卡了。搜了一下,大家都遇到这个问题了,原因嘛,多数都说跟墙有关系,我挂了个代理,依旧。。还有一种方法据说是用淘宝的镜像,http://www.cnblogs.com/trying/p/4064518.html。没去试,不太喜欢,就死等,大概半小时之后,显示成功了。
怀着激动得心情进到目录里,然后

$ react-native run-android

然而

FAILURE: Build failed with an exception.

检查了一下原因

What went wrong:
A problem occurred evaluating project ‘:app’.
SDK location not found. Define location with sdk.dir in the local.properties file or with an ANDROID_HOME environment variable.

一下想起来,我装的是Android Studio,不需要配置什么SDK路径之类的东西,所以就没在意这个部分,傻错。在~/.bash_profile里添加

export ANDROID_HOME=~/Library/Android/sdk

3.hello world

AwesomeProject就是刚才命令生成的工程。虽然不太适应,但是这个就是个helloworld工程。马上就能看到hello world了,很激动,怎么跑起来呢?

$ cd AwesomeProject
$ react-native run-android

然后能够看到又启动了一个terminal,写着

React packager ready.

并且在模拟器上看到welcome to react native!的字样,OK恭喜你成功了。http://blog.csdn.net/yzzst/article/details/48002187
说了这么多,其实我还是走了弯路才在这个链接上找到怎么run起来,我编译好了app之后,就用adb install去安装了,链接不上他js的服务,所以一直失败,最后在发现原来这么run起来。。

RNPolymerPo 是一个基于 React Native 的生活类聚合实战项目,目前由于没有 MAC 设备,所以没有适配 iOS,感兴趣的可以自行适配 app 目录下相关 JS 代码即可。 获取代码与编译调试打包 如下所有步骤及说明均为 React Native Android 的 DIY,涉及命令均为 Ubuntu 环境,Windows 类推即可。 1. 获取代码及模块安装和签名配置 执行如下命令进行代码下载及模块安装: $ git clone https://github.com/yanbober/RNPolymerPo.git $ cd RNPolymerPo $ npm install //如果觉得慢可以先切换到国内 npm 镜像源再执行此命令 配置 Gradle 个人签名路径及属性: //1. 把你个人的签名 my-release-key.keystore 文件(不知道如何生成请自行搜索)放到 RNPolymerPo 工程的 android/app 文件夹下。 //2. 编辑工程的 gradle.properties 文件,添加如下的代码(注意把其中的****替换为你自己相应密码)。 MYAPP_RELEASE_STORE_FILE=my-release-key.keystore MYAPP_RELEASE_KEY_ALIAS=my-key-alias MYAPP_RELEASE_STORE_PASSWORD=***** MYAPP_RELEASE_KEY_PASSWORD=***** 2. 编译打包 APK 文件 编译生成在线快速调试 Debug 开发包,执行如下命令: $ adb reverse tcp:8081 tcp:8081 $ react-native start //开启本地 JS 服务 $ react-native run-android //新终端的 RNPolymerPo 目录下执行 编译生成 release 包,执行如下命令: $ cd android && ./gradlew assembleRelease 拓展规划 下一个版本准备做的事情: 兼容性处理; 夜间模式; 热修复及 PHP 服务端编写; 多语言切换等问题评估;
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值