在我们对一个新事物没有想法，或者对其完全处于空白状态时，最好的方法是类比，怎么类比呢？经过上一节的内容我们已经能轻松的跑起来一个简单的react native的工程，还记得这张截图吗？

react native项目目录结构

   我们现在拿这张rn项目的结构与我们新建的android项目结构进行类比一下：

Android项目目录结构

    经过简单的类比，会发现，我们的安卓项目里比RN项目少几个文件，那么这几个文件哪些才是支撑起RN项目跑起来的文件呢。这当然不是瞎猜就能想出来的，接下来请移步react native的官网Integration With Existing Apps：integration with existing app， 大家完全可以按照官方介绍的来一步一步的走，但是这样，我不就装逼失败了吗。诸君请看官方给的融合项目的命令：

command ‘s integration with app

 npm init   该命令是为了创建package.json文件，

npm install--save react react-native   该命令为了安装node_modules这个库

curl-o.flowconfig https://raw.githubusercontent.com/facebook/react-native/master/.flowconfig 该命令是为了安装.flowconfig .

在package.json文件的上scripts标签下加入"start":"node node_modules/react-native/local-cli/cli.js start"，是为了可以在项目中使用npm命令，比如用npm启动package服务器，或者进行对js文件进行打本地的bundle文件等。

最后那个就不用说了吧，在项目根目录下加入js文件。这样就明了了，原来我们原生项目支持RN只需要添加以下文件

要添加的文件

      经过上一节我们已经拥有一个helloword的rn项目，我们将这些文件直接copy到原生项目中。

      补充：这样就会让项目局限在某个react native的版本，这是我们不想看到的，假如我们的客户就要求0.40的RN版本怎么办，打开package.json看这块

package.json的script

       我们的react - native的版本原来是在此处定义的，将它修改成你需要的版本，  在我们目前混合完成的项目的根目录下 启动命令npm  install 安装对应版本的node_modules。

       准备工作完成后，还有两个问题得解决 1、配置gradle文件让我们的代码能依赖到react native的库 ，2、建立RN入口来显示RN页面。我们知道h5网页在我们Android项目中跑起来是通过webview显示。同理，我们RN也有一个ReactRootView来支持。

       gradle配置：在Android studio工程中的gradle文件,有module的gradle,同时也有project的gradle。module中build.gradle的配置信息如下：

dependencies{...compile"com.facebook.react:react-native:+"// From node_modules.}

       project中的build.gradle配置信息如下：

allprojects{repositories{...maven{// All of React Native (JS, Android binaries) is installed from npmurl"$rootDir/node_modules/react-native/android"}}...}//此处注意rootDir的路径，保证能引到node_moduls正确的路径

在 清单文件AndroidManifest.xml中加入联网权限。

        创建入口ReactRootView的activity：（此处直接上截图，具体信息请查看文章末尾的源码链接）

RN入口activity

    同时加上ReactInstanceManager 的生命周期

ReactInstanceManager生命周期

看到我画圈的地方了吗，这是ReactRootView配置入口，画圈的地方是index.android.js(index.ios.js)里面AppRegistry注册的class，依然是上截图。

js注册的组件

  再次提醒，将两个文件中的名字保持一致，接下来就是上一节的内容了，用npm开启packager服务，启动app，加载RN页面。

关于打bundle方式加载JS文件，我们将放到下一节内容，最后附上本篇文章的源码链接，效果运行图如下：           

效果运行图

源码下载-----------------------------------------------sourcecode