1.先在項目工程中根目錄新建一個ReactNative文件夾,在此文件夾中中新建一個package.json文件,在文件中寫入
{
"name": "ReactNativeDemo",
"version": "0.0.1",
"private": true,
"scripts": {
"start": "node node_modules/react-native/local-cli/cli.js start"
},
"dependencies": {
"react": "16.6.3",
"react-native": "^0.58.6"
}
}
2.執(zhí)行npm install命令后,會出現(xiàn)node_modules文件
3.創(chuàng)建index.js文件作為程序入口。
4.在podfile中添加第三方依賴庫
platform :ios, '10.0'
source 'https://github.com/CocoaPods/Specs.git'
react_native_path = './ReactNative/node_modules/react-native'
target 'ExchangeToken' do
use_frameworks!
pod 'RxSwift' #響應(yīng)式編程
pod 'RxCocoa' #響應(yīng)式cocoa
pod 'Moya/RxSwift' #網(wǎng)絡(luò)請求
pod 'RxDataSources' #列表處理
pod 'ObjectMapper' #模型
pod 'Moya-ObjectMapper/RxSwift'
#數(shù)據(jù)庫
pod 'SDCAlertView'
pod 'IQKeyboardManagerSwift' #鍵盤處理
pod 'Toast-Swift', '~> 4.0.0' #toast
pod 'Kingfisher' #圖片處理
pod 'SwiftDate' #時間處理
pod 'PullToRefresher' #刷新
pod 'EmptyPage'#空白頁
pod 'SwifterSwift'
pod 'SnapKit'
pod 'DropDown'
pod 'CHKLineChartKit'
# 'node_modules'目錄一般位于根目錄中
# 但是如果你的結(jié)構(gòu)不同,那你就要根據(jù)實(shí)際路徑修改下面的`:path`
pod 'React', :path => react_native_path, :subspecs => [
'Core',
#'BatchedBridge', # 0.45 版本以后需要添加
'CxxBridge',
'DevSupport', # 如果RN版本 >= 0.43,則需要加入此行才能開啟開發(fā)者菜單
'RCTText',
'RCTImage',
'RCTNetwork',
'RCTWebSocket', # 這個模塊是用于調(diào)試功能的
# 在這里繼續(xù)添加你所需要的模塊
]
# 如果你的RN版本 >= 0.42.0,則加入下面這行
pod 'yoga', :path => react_native_path + '/ReactCommon/yoga'
# Third party deps
pod 'DoubleConversion', :podspec => react_native_path + '/third-party-podspecs/DoubleConversion.podspec'
pod 'glog', :podspec => react_native_path + '/third-party-podspecs/glog.podspec'
pod 'Folly', :podspec => react_native_path + '/third-party-podspecs/Folly.podspec'
# Pods for ExchangeToken
target 'ExchangeTokenTests' do
inherit! :search_paths
# Pods for testing
end
target 'ExchangeTokenUITests' do
inherit! :search_paths
# Pods for testing
end
end
5.更新podfile文件
6.在UIViewController中調(diào)用時需要跟RN工程師進(jìn)行制定規(guī)則,我是用Swift集成調(diào)用如下:
func setRN() {
let urlLocal = NSURL.init(string: "http://localhost:8081/index.bundle?platform=ios")
let rootView = RCTRootView.init(bundleURL: urlLocal! as URL, moduleName: "App", initialProperties: ["scores":[["name" : "Alex","value":12],["name" :"Joel","value":314]]], launchOptions: [:])
view = rootView
}