React Native探索系列四——让原有项目支持react-
2016-02-29 本文已影响1177人
西孟___
如果想把一个原来不支持react-native的项目变成支持react-native的项目,可以参考以下步骤(假设我们的原来不支持react-native的项目名为XWDemo,在Origin文件夹下)
步骤一:新建同名项目
在不同文件夹下,新建一个同名的react-native项目,具体操作如下:
-
打开终端,进入指定的文件夹(假设文件夹名字为ReactN)下,输入下面的命令:
react-native init XWDemo
步骤二:删除/替换
-
删除ReactN/XWDemo/ios/文件夹下的所有文件
-
将Origin/XWDemo/下的文件拷贝至ReactN/XWDemo/ios/文件夹下
步骤三:添加依赖库
- 在xcode中打开ReactN/XWDemo/ios/文件夹下的XWDemo.xcodeproj
- 新建一个名为Libraries的group
- 将依赖的react工程添加到Libraries组中,添加时可参考其他react-native项目
步骤四:修改工程文件
- 在xcode中打开ReactN/XWDemo/ios/文件夹下的XWDemo.xcodeproj,切换至TARGETS——>General下的
Linked Frameworks and Libraries
项,点“+”号添加依赖的.a静态库文件。 - 切换至TARGETS——>Build Settings下的
Search Paths
项,在Header Search Paths
中添加$(SRCROOT)/../node_modules/react-native/React
同时修改右侧是否递归选项为recursive
。 - 切换至TARGETS——>Build Phases,点坐上方的“+”号New Run Script Phase,命名为“Bundle React Native code and images”,同时修改脚本路径为
../node_modules/react-native/packager/react-native-xcode.sh
通过以上步骤,ReactN/XWDemo已经是支持react-native的项目了。
需要说明的是,让原有项目支持react-native其实方法有很多种,以上只是其中一种,更多的方法大家自己探索吧。