美文网首页RNReactNative 学习记录
React—Native IOS混合开发

React—Native IOS混合开发

作者: 行走的老程 | 来源:发表于2017-12-25 15:59 被阅读33次

       再此之前由于学习过一段时间的RN框架  对于RN可以说相对有些认知 在混编开始之前做了一个Demo  发现集成非常简单  然而在把之前构建的工程塞入到现有IOS工程中时发现了各种各样的错误 下面我简述所有步骤和发生的问题 

     1. 首先要做的就是将之前的RN工程塞入到IOS工程中

    我们可以看到 在这个文件中存在五个文件  其中index.ios.js 和package.json是我之前工程中的   index.ios.js 你可以理解为是RN的入口(当你第一次构建纯RN框架中会有这个文件)package.json 你可以理解成管理第三方的json文件 如果你对cocopod熟悉 你可以认为它和Podfile文件是一个作用  

    pack.json

    可以看到这就是pack.json

    接下来我们要做的就是加载第三方库 在操作这一步时终端一直显示报错  查看文档发现原来在高于0.44版本时 RN多了两个文件  但是这两个文件被墙了   所以导致了一系列的错误  再此我们的操作是  在科学上网的状态下进行更新 

    1.首先在工程当前目录键入npm install

    2.如果一切顺利 那么恭喜你 已经成功一半了 如果遇到报错   那来看看是否是以下错误

    1)connect@2.30.2: connect 2.x series is deprecated

    解决办法: 终端输入npm install -g npm

    2)npm WARN React-native@0.35.0 requires a peer of react@~15.3.1 but none was installed.

    解决办法:  1 终端输入npm install -save react@~16.0.0                 

                         2 更新react react-native upgrade                   

                         3最后启动 npm  npm install

    3.解决了以上问题 我们就可以将rn接入项目了   

    1)NSURL *jsCodeLocation = [NSURL     URLWithString:@"http://127.0.0.1:8081/index.ios.bundle?platform=ios&dev=true"];

    RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL : jsCodeLocation moduleName : @"TravelAssistant" initialProperties :nil launchOptions : nil];

    UIViewController *vc = [[UIViewController alloc] init];���

    vc.view = rootView;

    [self.navigationController pushViewController:vc animated:YES];

    这样我们就成功接入了React-Native  下次我们来聊聊汇编以后的那些事儿

    相关文章

      网友评论

        本文标题:React—Native IOS混合开发

        本文链接:https://www.haomeiwen.com/subject/dcqndttx.html