官方鏈接：reactnative.cn/docs/0.47/integration-with-existing-apps.html#content
1浅妆、創(chuàng)建一個(gè)根文件夾，里面創(chuàng)建一個(gè)字文件夾成榜，命名ios
2、在根文件夾下創(chuàng)建一個(gè)package.json 文件伴栓，終端touch?package.json 就可以
{ "name": "MyReactNativeApp",
"version": "0.0.1", "private": true,
"scripts": { "start": "node node_modules/react-native/local-cli/cli.js start" },
"dependencies": { "react": "16.0.0-alpha.6", "react-native": "0.44.3" }
}
3伦连、$ npm install ? ? 安裝JavaScript依賴包。（別告訴我你沒裝npm）
目前的目錄結(jié)構(gòu)如下圖：
4钳垮、官方文檔建議大家使用cocoapods 來配置環(huán)境惑淳，so，你得裝個(gè)cocoapods饺窿，（聽人勸歧焦，吃飽飯！）
5肚医、在 ios文件下绢馍，將我們的iOS工程拖進(jìn)來。look肠套，這里需要注意是將ios工程里的文件舰涌。我在測試的時(shí)候，將整個(gè)文件往里一丟你稚，后續(xù)的配置中出現(xiàn)了很多問題瓷耙≈焯桑看了React Native 初始化項(xiàng)目的目錄結(jié)構(gòu)，才發(fā)現(xiàn)不是這么回事搁痛。不多說了长搀，看圖！ 這樣的結(jié)構(gòu)才能讓react-native run-ios 的時(shí)候找到 .xcodeproj 文件 能夠運(yùn)行起來鸡典。
6源请、在 ios 文件下創(chuàng)建 Podfile文件，用來配置?所需要使用的 組件彻况。
$vi Podfile ?
內(nèi)容如下：
platform:ios,'8.0' ?#適配平臺(tái)
target 'TabBarTest' do ?#目標(biāo)文件
# 'node_modules'目錄一般位于根目錄中
# 但是如果你的結(jié)構(gòu)不同谁尸，那你就要根據(jù)實(shí)際路徑修改下面的`:path`
pod 'React', :path => '../node_modules/react-native', :subspecs => [
'Core',
'DevSupport', # 如果RN版本 >= 0.43，則需要加入此行才能開啟開發(fā)者菜單
'RCTText',
'RCTNetwork',
'RCTWebSocket', # 這個(gè)模塊是用于調(diào)試功能的
# 在這里繼續(xù)添加你所需要的模塊
]
# 如果你的RN版本 >= 0.42.0疗垛，則加入下面這行
pod "Yoga", :path => "../node_modules/react-native/ReactCommon/yoga"
end
7症汹、$pod install ? ? 沒有報(bào)錯(cuò)的話，恭喜你贷腕，環(huán)境配置成功了背镇！
8、在根目錄下泽裳，創(chuàng)建一個(gè)ios.index.js 文件瞒斩，既然是混合開發(fā)，沒有點(diǎn) js文件說不過去涮总。代碼很簡單胸囱，如下：
'use strict'import React,{Component} from 'react';
import { AppRegistry, Text, View} from 'react-native';
class TestView extends Component{
????render(){
????????return(<Text>It is a text</Text>)
????}
}
AppRegistry.registerComponent('MyReactNativeApp',()=>TestView);
9、在xcode項(xiàng)目中瀑梗，引用?#import <React/RCTRootView.h> 頭文件烹笔，用來裝 js 的頁面
NSURL *jsCodeLocation = [NSURL URLWithString:@"http://host:8081/index.ios.bundle?platform=ios"];
//? ? NSURL *jsCodeLocation = [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index.ios" fallbackResource:nil];
RCTRootView *rootView =
[[RCTRootView alloc] initWithBundleURL : jsCodeLocation
moduleName : @"MyReactNativeApp"
initialProperties :nil
launchOptions? ? : nil];
self.view = rootView;
ps：運(yùn)行時(shí)產(chǎn)生以下錯(cuò)誤:Could not connect to development server.?
Ensure?thefollowing:
-?Node?server?is?running?and?available?on?the?same?network?-?run'npm?start'from?react-native?root
-?Node?server?URL?is?correctly?set?in?AppDelegate
將host 切換成你本地的ip。
10抛丽、在根目錄下谤职，啟動(dòng)終端。$npm start ? 啟動(dòng)開發(fā)服務(wù)器亿鲜，這個(gè)終端是不能關(guān)閉的哦
11允蜈、可以通過Go2Shell （App Store 自行下載）重啟一個(gè)終端 $react-native run-ios ?運(yùn)行iOS模擬器。
如果出現(xiàn)錯(cuò)誤蒿柳，$npm install 關(guān)閉終端重啟一下饶套，在運(yùn)行。
在環(huán)境配置的過程中可能出現(xiàn)很多問題垒探，需要你安裝妓蛮、升級一些文件。一般報(bào)錯(cuò)問題圾叼，度娘都能解決的蛤克。
Good Luck ～
