运行ReactNative示例
既然感觉ReactNative开发靠谱, 那么我们就来看看ReactNative都能做哪些好玩的东西, 和原生的有哪些区别?
示例图
按照文档安装一些命令行工具, 再下载Git代码.
Github: https://github.com/非死book/react-native
内容很多, 包含一些依赖库和示例(Example), 下载的有点慢, 耐心等待.
下载完成后, 在react-native
内, 执行npm install
.
Android项目执行, 参考ReactAndroid的README.md.
在react-native
目录, 新建local.properties
sdk.dir=/Users/wangchenlong/Installations/android-sdk ndk.dir=/Users/wangchenlong/Installations/android-ndk-r10e
执行
cd react-native ./gradlew :ReactAndroid:assembleDebug
再执行
./gradlew :ReactAndroid:installArchives
启动服务
./packager/packager.sh
安装项目
cd react-native ./gradlew :Examples:UIExplorer:android:app:installDebug
一定要先启动服务, 再安装项目.
出现transforming 100%, 即导入成功.
真机调试, 本人红米note(Android 4.2)
摇动手机, 选择Dev Settings
->Debug sever host & port for device
. 设置IP地址, 观察本机的IP, 填入即可. 我当前的是
192.168.2.202:8081
注意一定要设置端口8081, 否则无法加载.
Android5.0以上, 直接设置端口即可.
adb reverse tcp:8081 tcp:8081
IOS模拟器, 太穷没有iPhone. 直接打开open UIExplorer.xcodeproj
项目, 执行就可以显示.
开发有两种选择, 一种是直接基于ReactNative开发, 一种是把ReactNative集成到现有的App中, 对于第二种, 我们就需要关注, ReactNative会增大多少代码呢?
使用最基本的HelloWorld做测试, ReactNative也是生成一个简单HelloWorld的JS. 最新生成的HelloWorld的大小是1.4M, 加上ReactNative的是7.6M, 框架大约6.2M左右, 各位可以权衡一下使用.
ReactNative的UIExplorer已经包含了大量示例, 很接近原生, 非常绚丽, 速度也很快. 如Android的ViewPager
OK, 好的开始是成功的一半, 继续探索吧! Enjoy it!
来自: http://blog.csdn.net//caroline_wendy/article/details/49534847