1. 在现有的项目(以 ReactNativeTest 为例)基础上导入,ReactNativeTest 已经集成了cocoapods (注:版本要在1.2.0以上,否则后面会报错)
查看cocoapods版本命令
pod - -version
2.安装React Native的命令行工具
npm install -g react-native-cli
3.进入你工程的根目录
4.这个工作跟cocoapods的podfile文件初始化有点像 -> 根据提示输入工程的package.json的内容。
npm init
5.编辑package.json,往dependencies添加如下依赖(以下是我编辑好的内容)
{
"name": "react-one",
"version": "1.0.0",
"description": "first init",
"main": "index.js",
"dependencies": {
"react": "15.4.1",
"react-native": "^0.43.4"
},
"devDependencies": {},
"scripts": {
"test": "first test"
},
"repository": {
"type": "git",
"url": "main"
},
"keywords": [
"first",
"test"
],
"author": "NB_killer",
"license": "ISC"
}
6.安装
npm install
如果需要更新:
react-native upgrade
7.配置podfile
platform :ios, '9.0'
target 'ReactNativeTest' do
# 'node_modules'目錄一般位於根目錄中
# 但是如果你的結構不同,那你就要根據實際路徑修改下面的`:path`
pod 'React', :path => './node_modules/react-native', :subspecs => [
'Core',
'RCTText',
'RCTNetwork',
'RCTWebSocket', # 這個模塊是用於調試功能的
# 在這裏繼續添加你所需要的模塊
]
# 如果你的RN版本 >= 0.42.0,請加入下面這行
pod 'Yoga', :path => './node_modules/react-native/ReactCommon/yoga’
end
8.导入类库
pod install
9.编辑 index.ios.js
10.添加libraries
11.启动开发服务器
在文件根目录执行
react-native start
12.设置网络环境
13.在 RNViewController控制器中 导入 RN
14.运行ios项目
通过Xcode点击项目或者command + R运行项目,就会看到成功运行的界面:
15.总结
在实际导入过程中可能遇到一些错误,不要着急,有错就去github 或者 Stack Overflow 上找答案,祝君好运!