官方文檔地址： Integration with Existing Apps - React Native
中文文檔：React Native 中文網(wǎng)
React-Native 開源App項目：GitHub - ReactNativeNews/React-Native-Apps: Curated List of Open Source React Native Apps
安裝準備
安裝 npm 、node纹腌、cocoapod、xcode扭吁、android studio
安裝方法
方法1：create-react-native-app
npm install -g create-react-native-app
create-react-native-app 項目名
cd 項目名
yarn start
用 expo App 掃描運行后的二維碼可以直接運行
方法2：react-native init
react-native init 項目名
cd 項目名
react-navtive run-ios
react-navtive run-android
react-navtive run-ios 卡在 Running script 'Install Third Party'
- 原因: boost_1_63_0.tar.gz 下載失敗
- 下載地址：Releases · react-native-community/boost-for-react-native · GitHub
- 把 boost_1_63_0.tar.gz 放入 ~/.rncache 文件夾，再次運行 react-navtive run-ios 即可
方法3：集成到已有iOS項目
按著文檔做無法編譯通過
- 在iOS項目中創(chuàng)建文件夾 ReactNative
- 在 ReactNative 文件夾新建 package.json，內(nèi)容：
{
"name": "TestOCRN",
"version": "0.0.1",
"private": true,
"scripts": {
"start": "node node_modules/react-native/local-cli/cli.js start"
},
"dependencies": {
"react": "16.0.0",
"react-native": "0.50.0"
}
}
- 調(diào)用
npm install - 創(chuàng)建 PodFile,
pod init - 在 PodFile 中寫入下面的內(nèi)容
source 'https://github.com/CocoaPods/Specs.git'
platform :ios, '8.0'
use_frameworks!
target 'TestOCRN' do
pod 'React',
:path => './ReactNative/node_modules/react-native',
:subspecs => [
'Core',
'ART',
'RCTActionSheet',
'RCTGeolocation',
'RCTImage',
'RCTNetwork',
'RCTPushNotification',
'RCTSettings',
'RCTText',
'RCTVibration',
'RCTWebSocket',
'RCTLinkingIOS',
'RCTAnimation',
]
pod "yoga", :path => "./ReactNative/node_modules/react-native/ReactCommon/yoga"
end
- 運行 pod install
- 打開 TestOCRN.xcworkspace 運行
問題描述 ：‘fishhook/fishhook.h’ file not found
- 在package.json scripts 中添加
"fishhookinstall": "sed -i '' 's#<fishhook/fishhook.h>#\"fishhook.h\"#g' ./node_modules/react-native/Libraries/WebSocket/RCTReconnectingWebSocket.m", - 運行:
npm run fishhookinstall - 返回 Podfile 目錄
pod install
問題描述 ：'RCTAnimation/RCTValueAnimatedNode.h' file not found
- 在package.json scripts 中添加
"nodeinstall": "sed -i '' 's\/#import <RCTAnimation\\/RCTValueAnimatedNode.h>\/#import \"RCTValueAnimatedNode.h\"\/' ./node_modules/react-native/Libraries/NativeAnimation/RCTNativeAnimatedNodesManager.h", - 運行:
npm run nodeinstall - 返回 Podfile 目錄
pod install
問題："_JSNoBytecodeFileFormatVersion", referenced from:
- 添加
BatchedBridgeReact subspec in Podfile
集成到已有的Android
- 按著文檔做谷饿，可以完成
