React Navite踩坑日记（七） —— iOS原生工程集成 RN

Github 工程链接

概述

iOS原生包RN, 即为以iOS为基础工程,在指定的页面,包入react native提供的RCTRootView页面.
因过程较为繁琐,涉及podfile生成,初始化RN工程,指定版本,启动 RN本地服务器等等,不一而足, 因此采用 Python调用系统的shell脚本来完成.
参考文章 -- reactnative集成到原生ios项目

前提

• 已经安装并配置好了React native环境
• 已经安装并配置好了CocoaPods环境
• 使用 Mac OSX, 自带Python 2.x环境
• 我们不使用参考链接中的手动拖曳的方式添加RN工程,而是采用CocoaPods的本地映射方式管理RN

使用

• 新建一个原生的iOS工程, 假设名为 ApplePrj
• 将本文件拷贝至ApplePrj同目录下
• 在终端中 cd到ApplePrj锁在目录, 然后执行python rnPrjInit即可
• 如果中间没有问题,会执行到本地服务器启动的页面

下面是执行过程 --- 旨在记录脚本究竟做了什么

以下为同步执行的过程

• 根据.py文件中设定好的RN版本,在原生工程的同级目录下,去生成一个名为ReactNativePrj的RN原生工程.

  PS: 此时工程生成的两个包含各自平台的文件夹,ios和android文件夹,其实是没有用的,可以删掉.不删掉也没事.

• 获取ApplePrj锁在目录的文件夹名称, 即假设文件目录为~/user/bin/ApplePrj,我需要获取工程的名称,也就是这里的目录文件名ApplePrj,也就是iOS原生工程的文件名.
• 根据设置好的ios版本,在当前目录下,去生成一个Podfile --- 这里可以省去编写dependency的麻烦,不过如果有新的依赖库,可以在生成后自行修改,然后再单独执行pod update命令
• 执行Podfile中的指令,相当于在终端中执行pod update. -- 此时里面的 target PrjName do,PrjName已经在上面获取到了工程的名称.
• 执行成功后,cd到RN的工程中,执行react-native start开启本地服务器.
• 此时有可能会失败,需要进一步执行chmod -R 777 node_modules

以上,谢谢.