通过示例程序可以看到一些基本组件的使用,对于学习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的更多相关文章

  1. Arduino+ESP32 之 驱动GC9A01圆形LCD(二),移植LVGL,跑示例程序,显示自制图片

    在前文Arduino+ESP32 之 驱动GC9A01圆形LCD(一), 我们已经移植好了arduino GFX库, 该库的示例程序内,还有LVGL的示例程序哦. arduino环境下移植lvgl是很 ...

  2. .NET跨平台:在Ubuntu上用自己编译的dnx运行ASP.NET 5示例程序

    在 Linux Ubuntu 上成功编译 dnx 之后,会在 artifacts/build/ 文件夹中生成 dnx-coreclr-linux-x64/ 与 dnx-mono/ 这2个文件夹,前者是 ...

  3. .NET跨平台:在CentOS上编译dnx并运行ASP.NET 5示例程序

    在之前的博文中我们在 Ubuntu 上成功编译出了 dnx ,并且用它成功运行了 ASP.NET 5 示例程序.在这篇博文中我们将 Ubuntu 换成 CentOS. 目前 dnx 的编译需要用到 m ...

  4. 单独编译IMX6Q的VPU示例程序:mxc_vpu_test.out

    mxc_vpu_test.out是飞思卡尔为IMX6Q编写的VPU示例程序,有编解码和简单的网络传输功能. 首先从/opt/freescale/pkgs/中提取出imx-test-3.0.35-4.1 ...

  5. FFmpeg示例程序合集-批量编译脚本

    此前做了一系列有关FFmpeg的示例程序,组成了<最简单的FFmpeg示例程序合集>,其中包含了如下项目:simplest ffmpeg player:                   ...

  6. 通过Jexus 部署 dotnetcore版本MusicStore 示例程序

    ASPNET Music Store application 是一个展示最新的.NET 平台(包括.NET Core/Mono等)上使用MVC 和Entity Framework的示例程序,本文将展示 ...

  7. DotNetBar for Windows Forms 12.7.0.10_冰河之刃重打包版原创发布-带官方示例程序版

    关于 DotNetBar for Windows Forms 12.7.0.10_冰河之刃重打包版 --------------------11.8.0.8_冰河之刃重打包版------------- ...

  8. DotNetBar for Windows Forms 12.5.0.2_冰河之刃重打包版原创发布-带官方示例程序版

    关于 DotNetBar for Windows Forms 12.5.0.2_冰河之刃重打包版 --------------------11.8.0.8_冰河之刃重打包版-------------- ...

  9. DotNetBar for Windows Forms 12.2.0.7_冰河之刃重打包版原创发布-带官方示例程序版

    关于 DotNetBar for Windows Forms 12.2.0.7_冰河之刃重打包版 --------------------11.8.0.8_冰河之刃重打包版-------------- ...

随机推荐

  1. Oracle 数据库基础学习 (四) group by的使用

      group by分组查询 示例:要求查询出每个部门的编号,人数,以及最高和最低工资  select deptno, count(empno), max(sal), min(sal) from em ...

  2. [moka同学笔记]Yii2中多表关联查询(join、joinwith) (摘录)

    表结构 现在有客户表.订单表.图书表.作者表, 客户表Customer   (id  customer_name) 订单表Order          (id  order_name       cu ...

  3. GJM: Unity3D基于Socket通讯例子 [转载]

    首先创建一个C# 控制台应用程序, 直接服务器端代码丢进去,然后再到Unity 里面建立一个工程,把客户端代码挂到相机上,运行服务端,再运行客户端. 高手勿喷!~! 完全源码已经奉上,大家开始研究吧! ...

  4. ServletContext与网站计数器

    什么是ServletContext? ServletContext是服务器的一个公用的空间,是不同的浏览器共享的一个数据. 由图可以看出ServletContext和Cookie与session之间的 ...

  5. javascript数据类型理解整理

    起因:关于数据类型这块,自己看了很多遍相关的资料,每次查看和实践都有一些体会和理解:但又感到没有理解透,总是差一点,最近又在看这块的内容,加上最近的积累,做个相关笔记 ECMAScript数据类型:1 ...

  6. JS高程2.在HTML中使用Javascript(1)

    1.使用<script>元素向HTML页面中插入Javascript HTML4.01中<script>标签有6个属性: (1)async:可选.表示立即下载脚本,不影响页面中 ...

  7. 轻松掌握:JavaScript享元模式

    享元模式 在JavaScript中,浏览器特别是移动端的浏览器分配的内存很有限,如何节省内存就成了一件非常有意义的事情.节省内存的一个有效方法是减少对象的数量. 享元模式(Flyweight),运行共 ...

  8. 【原】iOS动态性(二):运行时runtime初探(强制获取并修改私有变量,强制增加及修改私有方法等)

    OC是运行时语言,只有在程序运行时,才会去确定对象的类型,并调用类与对象相应的方法.利用runtime机制让我们可以在程序运行时动态修改类.对象中的所有属性.方法,就算是私有方法以及私有属性都是可以动 ...

  9. Request.MapPath和ServerMapPath

    一.路径 / 念 反斜杠,/ 是超文本协议的路径分隔符号,所有的网站在浏览器中显示的路径分隔都是以"/"表示.它一般代表虚拟路径. \ 念 斜杠,在普通程序代码中则以"\ ...

  10. 浅析css布局模型2

    上节对整个布局模型进行了概述,这节先谈一下布局模型的几个属性. z-index属性 该属性是检索或设置对象的层叠顺序,默认值为auto,遵循其父对象的定位. 并级的对象,该属性的值越大,则被层叠在最上 ...