美文网首页RN
初次尝试ReactNative 的坑

初次尝试ReactNative 的坑

作者: Dannn_Y | 来源:发表于2017-11-27 18:49 被阅读32次

今天首次尝试使用RN,真的是困难重重,一不小心就漂一片红,真是心力交瘁。

首先是跟着官网这一篇教程学习的https://facebook.github.io/react-native/docs/integration-with-existing-apps.html 在现有iOS项目中添加RN,项目中只是部分页面需要使用RN,而不是全部页面。

按照上面一步步来流程是没有什么问题,只是当你想把项目跑起来的时候,肯定会遇到问题,因为这篇文档上缺少了一些步奏,下面是我按照这个教程学习RN,遇到的一些问题和解决办法,如果你也遇到了相同的问题,希望能帮到你。

一、直接用Xcode打开ios项目run,报如下error

error : '_JSNoBytecodeFileFormatVersion", referenced from'

screenshot.png
 pod 'React', :path => '../node_modules/react-native', :subspecs => [
    'Core',
    'DevSupport', # Include this to enable In-App Devmenu if RN >= 0.43
    'RCTText',
    'RCTNetwork',
    'RCTWebSocket', # needed for debugging
    'BatchedBridge',  # needed as of (0.46)
    # Add any other subspecs you want to use in your project
  ]
  # Explicitly include Yoga if you are using RN >= 0.42.0
  pod 'yoga', :path => '../node_modules/react-native/ReactCommon/yoga'

看到这个podfile文件和官方文档上的不同了吗,对了多加了一条'BatchedBridge'就是因为没有引进这个文件才导致的报错,所以添加上这个文件重新pod install就可以了。

二、查看RN创建的RCTRootView页面,报错“Application RNHighScores has not been registered”

screenshot.png

并有下面的提示,小白做这个还是不太懂,明明是照着文档写的为什么错了呢,查看根目录下的index.js文件

AppRegistry.registerComponent('MyReactNativeApp', () => RNHighScores);

是注册RNHighScores的问题吗?搜了一些网上的回答,说是需要AppRegistry.registerComponent('项目名称', () => RNHighScores); 这里填写的项目名称需要和RCTRootView初始化时,填写的moduleName保持一致

RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation
                                                      moduleName:@"项目名称"
                                               initialProperties:nil
                                                   launchOptions:launchOptions];

尝试着修改了下,能顺利的跑起来了,所以如果碰到这个问题试着都换成组件名称试试。

第一次尝试RN,坑果然是很多,不过这是技术的趋势,以后编写代码将会越来越简单.

相关文章

  • 初次尝试ReactNative 的坑

    今天首次尝试使用RN,真的是困难重重,一不小心就漂一片红,真是心力交瘁。 首先是跟着官网这一篇教程学习的https...

  • 2019-05-06

    ReactNative踩坑日志——OnPress随着render()执行被自动调用? 在ReactNative中,...

  • #ReactNative macOS iOS环境搭建

    尝试使用Facebook出品的ReactNative框架进行iOS项目的开发,今天是参照ReactNative中文...

  • ReactNative初体验HelloWorld

    近来由于ReactNative颇为火爆,所以也尝试了一把ReactNative搭建最初的HelloWorld程序。...

  • 初次尝试

    受到研究员的启发,朋友圈的引导,第一次尝试写简书,希望能坚持下去,别再长草了!

  • 初次尝试

    器材:魅蓝3S 后期:Snapseed、MIX、Retouch、VSCO 艺考生一枚,还请前辈们指点!

  • 初次尝试

    the words of hand

  • 初次尝试

    下午,像日常一样—刷着朋友圈、打着宅系游戏。但下一秒我始终没有想到,我会穿越,虽然我憧憬过、期待过,但这么草率地穿...

  • 初次尝试

    手痒尝试画一下,感觉还挺累。继续…

  • 初次尝试

    有点纠结 一直以来,都想写点东西的,真的,可不知从何说起,身边的东西太多,繁复又零碎,分不清个主次,整不出个顺序,...

网友评论

    本文标题:初次尝试ReactNative 的坑

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