前段时间一直想开发一个记录时间开销的app,但是又不想去学android开发,于是就是想使用facebook开源的React-Native 来尝试开发。在自学过程中踩过一些坑,记录下来。

1.搭建环境

这个比较简单,先安装nodejs,然后再安装react-native-cli, 具体步骤可以参考官方的文档搭建开发环境, 这篇文档写的很清楚

2.编写Hello World

搭建好环境之后,就可以建一个项目测试一下了。

react-native init test
cd test
react-native run-android

很遗憾,在你按照官网的教程运行react-native run-android 可能会遇到类似下面的报错

FAILURE: Build failed with an exception.

* What went wrong:
Execution failed for task ':app:installDebug'.
> com.android.builder.testing.api.DeviceException: No connected
> devices!

找不到模拟器设备,而官网上并没有告诉你怎么去启动模拟器。首先,你需要添加环境变量, vim ~/.profile, 加上如下代码(如果已经添加请略过此步)

# ~/Android 是你Android SDK的根目录,如果你的目录不是这样的请自行更改。
PATH="~/Android/Sdk/tools:~/Android/Sdk/platform-tools:${PATH}"
export PATH

当然你需要注销重新登陆系统或者执行

source ~/.profile 

来使配置生效。接下来,执行

android avd

进入模拟器管理界面,如下:

点击 Create 按钮创建一个新的模拟器,然后再点击 Start 按钮启动就好了。

然后再切换到 test 项目目录,执行 react-native run-android 就可以在模拟器中测试项目了。

我的测试项目启动预览图如下

3.打包APK项目

在项目开发完成之后就要将项目打包成APK了,这个react-native官方也有详细的教程 打包APK

《完》