如何编译ReactNative示例程序Examples
通过示例程序可以看到一些基本组件的使用,对于学习ReactNative是很有帮助的。
编译示例程序需要将整个项目导入到androidStudio中,androidStudio导入项目时选择react-native/ReactAndroid目录。
由于项目依赖ndk因此如果要编译Examples还需要安装配置ndk目录,下载ndk后是一个自解压程序,会释放ndk的目录。
然后需要设置环境变量或者在react-native根目录下新建local.properties文件,文件内容如下:
sdk.dir=c:\你的sdk目录
ndk.dir=c:\你的ndk目录
设置要之后就可以编译了,导入和编译的过程比较曲折,请继续看下文。
在编译AwesomeProject项目时,没有用到ndk,实际上这里的ndk默认情况下并没有用到,只是gradle的设置里有ndk因此必须配置ndk才能导入项目。
ndk是在编译核心库是才用到,核心库位于react-native/ReactAndroid,导入整个项目时以lib形式存在。
查看Examples目录下UIExplorer,会发现在build.gradle是以在线的方式导入核心库的。通过源码的方式导入被注释掉了。
dependencies {
compile fileTree(dir: 'libs', include: ['*.jar'])
compile 'com.android.support:appcompat-v7:23.0.1'
// Depend on pre-built React Native
compile 'com.facebook.react:react-native:0.11.+'
// Depend on React Native source.
// This is useful for testing your changes when working on React Native.
// compile project(':ReactAndroid')
}
由此可知,编译UIExplorer并不需要ndk,如果你不想设置ndk,有2个办法
1.拷贝AwesomeProject项目中的build.gradle,settings.gradle到UIExplorer的android目录,在导入项目时选择UIExplorer/android就可以了,这样androidStudio会导入单个项目,否则会导入整个项目。
2.用androidStudio新建一个同名的项目,然后把UIExplorer目录中的文件拷贝到新建的项目中。
编译好之后启动服务器端,到react-native目录下执行:
npm install
node packager\packager.js
windows下如果出现错误需要根据错误提示修改代码
http://www.cnblogs.com/zhaojietec/p/4853273.html
不过需要注意的是,目前为止,UIExplorer在Android下有一个bug,IOS下没有问题,通过google可以找到了解决办法。
https://github.com/facebook/react-native/issues/2855
原因是,js代码和android原生代码不同步,通过build.gradle可以看到android下的引用的reactNative核心库为11,而js代码版本已经更新到12了。
解决的办法有2个,一个是使用git工具(如smartGit),将js代码恢复到之前的版本,另一个办法是重新编译reactNative的核心库,编译核心库需要ndk,在mac下没有问题,在windows编译会出错。
编译reactNative核心库,对UIExplorer下注释掉的依赖项进行修改即可,编译速度较慢 需要在线下载第三方依赖库。
dependencies {
compile fileTree(dir: 'libs', include: ['*.jar'])
compile 'com.android.support:appcompat-v7:23.0.1'
// Depend on pre-built React Native
//compile 'com.facebook.react:react-native:0.11.+'
// Depend on React Native source.
// This is useful for testing your changes when working on React Native.
compile project(':ReactAndroid')
}
由于windows下无法编译,所以这里提供编译好的aar文件,修改UIExplorer build.gradle中的依赖项就可以了。至于如何引入aar文件,可以自行搜索。
当然mac下同样也可以用这个aar,可以省去不少麻烦。
网盘下载地址(需要密码):
链接:http://share.weiyun.com/f4460735f3b44a4e79ddc7032d6f95f7
由于本人刚建的微信公众号还没有人关注,因此请关注我的微信公众号:zhaojieTec,回复“aar”后获取密码。
是的,你没有看错,这就是传说中的隐藏内容请回复查看。
另外网盘中也提供编译好的loader程序,UIExplorer (ps:facebook真是不厚道为什么不提供编译好的程序看一下效果呢)。
如何编译ReactNative示例程序Examples的更多相关文章
- Arduino+ESP32 之 驱动GC9A01圆形LCD(二),移植LVGL,跑示例程序,显示自制图片
在前文Arduino+ESP32 之 驱动GC9A01圆形LCD(一), 我们已经移植好了arduino GFX库, 该库的示例程序内,还有LVGL的示例程序哦. arduino环境下移植lvgl是很 ...
- .NET跨平台:在Ubuntu上用自己编译的dnx运行ASP.NET 5示例程序
在 Linux Ubuntu 上成功编译 dnx 之后,会在 artifacts/build/ 文件夹中生成 dnx-coreclr-linux-x64/ 与 dnx-mono/ 这2个文件夹,前者是 ...
- .NET跨平台:在CentOS上编译dnx并运行ASP.NET 5示例程序
在之前的博文中我们在 Ubuntu 上成功编译出了 dnx ,并且用它成功运行了 ASP.NET 5 示例程序.在这篇博文中我们将 Ubuntu 换成 CentOS. 目前 dnx 的编译需要用到 m ...
- 单独编译IMX6Q的VPU示例程序:mxc_vpu_test.out
mxc_vpu_test.out是飞思卡尔为IMX6Q编写的VPU示例程序,有编解码和简单的网络传输功能. 首先从/opt/freescale/pkgs/中提取出imx-test-3.0.35-4.1 ...
- FFmpeg示例程序合集-批量编译脚本
此前做了一系列有关FFmpeg的示例程序,组成了<最简单的FFmpeg示例程序合集>,其中包含了如下项目:simplest ffmpeg player: ...
- 通过Jexus 部署 dotnetcore版本MusicStore 示例程序
ASPNET Music Store application 是一个展示最新的.NET 平台(包括.NET Core/Mono等)上使用MVC 和Entity Framework的示例程序,本文将展示 ...
- DotNetBar for Windows Forms 12.7.0.10_冰河之刃重打包版原创发布-带官方示例程序版
关于 DotNetBar for Windows Forms 12.7.0.10_冰河之刃重打包版 --------------------11.8.0.8_冰河之刃重打包版------------- ...
- DotNetBar for Windows Forms 12.5.0.2_冰河之刃重打包版原创发布-带官方示例程序版
关于 DotNetBar for Windows Forms 12.5.0.2_冰河之刃重打包版 --------------------11.8.0.8_冰河之刃重打包版-------------- ...
- DotNetBar for Windows Forms 12.2.0.7_冰河之刃重打包版原创发布-带官方示例程序版
关于 DotNetBar for Windows Forms 12.2.0.7_冰河之刃重打包版 --------------------11.8.0.8_冰河之刃重打包版-------------- ...
随机推荐
- springmvc中RequestMapping的解析
在研究源码的时候,我们应该从最高层来看,所以我们先看这个接口的定义: package org.springframework.web.servlet; import javax.servlet.htt ...
- Gym 101102J---Divisible Numbers(反推技巧题)
题目链接 http://codeforces.com/gym/101102/problem/J Description standard input/output You are given an a ...
- cnodejs社区论坛6--评论功能
- [Cordova] Plugin开发入门
[Cordova] Plugin开发入门 Overview Cordova的设计概念,是在APP上透过Web控件来呈现Web页面,让Web开发人员可以操作熟悉的语言.工具来开发APP.使用Web页面来 ...
- JPA persistence
Play provides a set of very useful helpers to simplify the management of your JPA entities. Note tha ...
- Swiper – 经典的移动触摸滑块插件【免费】
Swiper 是移动 Web 开发中最常用的滑块插件,是一款免费的,最现代化的移动触摸滑块,支持硬件加速的转换和惊人的原生表现.它的目的是在移动网站,移动 Web 应用程序和 Hygrid 混合应用程 ...
- 什么是闭包(closure),为什么要用它?
闭包是指有权访问另一个函数作用域中变量的函数,创建闭包的最常见的方式就是在一个函数内创建另一个函数,通过另一个函数访问这个函数的局部变量,利用闭包可以突破作用链域,将函数内部的变量和方法传递到外部. ...
- go语言常用函数:make
创建数组切片 Go语言提供的内置函数make()可以用于灵活地创建数组切片.创建一个初始元素个数为5的数组切片,元素初始值为0: mySlice1 := make([]int, 5) 创建一个初始元素 ...
- 从零开始,做一个NodeJS博客(四):服务器渲染页面与Pjax
标签: NodeJS 0 一个星期没更新了 = = 一直在忙着重构代码,以及解决重构后出现的各种bug 现在CSS也有一点了,是时候把遇到的各种坑盘点一下了 1 听歌排行 API 修复与重构 1.1 ...
- 图形学理论知识 BRDF 双向反射分布函数(Bidirectional Reflectance Distribution Function)
图形学理论知识 BRDF 双向反射分布函数 Bidirectional Reflectance Distribution Function BRDF理论 BRDF表示的是双向反射分布函数(Bidire ...