react-native init NewRN
-
把rn项目中的 pacgage.json文件和index.ios.js文件拷贝到iOS项目的根目录
- 根目录:node_modules所在同级目录
- /是相对位置
-
在原有iOS项目中根目录
npm install
touch Podfile
platform :ios, '8.0'
target 'NewRN' do
react_native_path = "./node_modules/react-native”
pod "React", :path => react_native_path, :subspecs => [
'Core',
'RCTActionSheet',
'RCTGeolocation',
'RCTImage',
'RCTLinkingIOS',
'RCTNetwork',
'RCTSettings',
'RCTText',
'RCTVibration',
'RCTWebSocket'
]
end
pod install
注意: 如果终端出现找不到yoga路径,那么需要在podfile文件中添加路径
pod 'Yoga', :path => './node_modules/react-native/ReactCommon/yoga'
-
编辑index.ios.js 内容
-
修改原生项目里的内容
#import "RNViewController.h"
#import <React/RCTRootView.h>
@interface RNViewController ()
@end
@implementation RNViewController
- (void)viewDidLoad {
[super viewDidLoad];
self.title = @"RN页面";
NSURL *jsCodeLocation;
jsCodeLocation = [NSURL URLWithString:@"http://localhost:8081/index.ios.bundle?platform=ios&dev=true"];
RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation
moduleName:@"newRN"
initialProperties:nil
launchOptions:nil];
rootView.frame = [[UIScreen mainScreen]bounds];
[self.view addSubview:rootView];
}
@end
App Transport Security Settings -> Allow Arbitrary Loads->YES