https://reactnative.cn/docs/integration-with-existing-apps/

1、创建一个xcode工程,single View就行,项目语言选择swift,oc的直接生成就行不用这么麻烦。
2、把跟目录上创建 node的package.json,执行命令

npm init
npm install react-native --save-dev
npm install react --save-dev
 
3、创建podfile文件,然后执行pod install ,必须第二步完成。代码如下:

# Uncomment the next line to define a global platform for your project
# platform :ios, '9.0'

target 'demo1' do
  # Comment the next line if you're not using Swift and don't want to use dynamic frameworks
  use_frameworks!

  pod 'DoubleConversion', :podspec => './node_modules/react-native/third-party-podspecs/DoubleConversion.podspec'
  pod 'glog', :podspec => './node_modules/react-native/third-party-podspecs/GLog.podspec'
  pod 'Folly', :podspec => './node_modules/react-native/third-party-podspecs/Folly.podspec'

  pod 'React', :path => './node_modules/react-native', :subspecs =>  [
  'Core',
  'DevSupport',
  'RCTText',
  'RCTNetwork',
  'RCTWebSocket',
  'CxxBridge'
  ]

  # 如果你的RN版本 >= 0.42.0,请加入下面这行
  pod "yoga", :path => "./node_modules/react-native/ReactCommon/yoga"

end

执行npm start 启动服务

运行项目  

出现如下错误

查了下资料 需要修改

在info.plist中添加 AppTransport Security Settings 在其下再添加 Allow Arbitrary Loads选择为 yes,修改网络可以使用http请求。

运行正常

ok,  新建Swift工程,配合Cocoapods 构建react-native项目就完成了。

demo地址

https://github.com/youhui/react-native-cocoapods-swift-project

react-native-Cocoapods-Swift-Project的更多相关文章

  1. react native与现有的应用程序集成

    (1)通过cocopods 集成 ,以下内容 参考 http://wiki.jikexueyuan.com/project/react-native/integration-existing.html ...

  2. Flipper & React Native

    Flipper & React Native Flipper Flipper是一款用于调试移动应用程序的出色开发人员工具,在Android和iOS社区中颇受欢迎. Flipper is a g ...

  3. iOS、swift、React Native学习常用的社区、论坛

    <!----iOS> <!----Swift>*IOS开发常用社区:http://code4app.com/ *IOS开发常用社区:http://www.cocoachina. ...

  4. Swift Modules for React Native

    React Native is an Objective-C application framework that bridges JavaScript applications running in ...

  5. react native 0.50与OC交互 && Swift与RN交互

    新公司也打算做rn,还是得捡起来再度学习.开撸! react native一个版本一个样子,之前写的rn与iOS交互系列在最新版本中有点出入(0.50.4版本).今天填一下坑. 首先上npm版本,re ...

  6. Kotlin & Android & Swift & Flutter & React Native

    Kotlin & Android https://www.runoob.com/kotlin/kotlin-tutorial.html Swift 5 & iOS 12 https:/ ...

  7. React native 无法弹出调试控件的问题

    React Native 在debug模式下,可以通过摇动手机,弹出调试选项.但是今天利用了cocoapods 把react native 文件整理后,调试界面就弹不出了,其他功能正常.查了好久,发现 ...

  8. Xamarin vs React Native vs Ionic vs NativeScript: Cross-platform Mobile Frameworks Comparison

    CONTENTS Reading time: 14 minutes Cross-platform mobile development has long been a viable alternati ...

  9. 【独家】React Native 版本升级指南

    前言 React Native 作为一款跨端框架,有一个最让人头疼的问题,那就是版本更新.尤其是遇到大版本更新,JavaScript.iOS 和 Android 三端的配置构建文件都有非常大的变动,有 ...

  10. React Native:使用 JavaScript 构建原生应用

    [转载] 本篇为联合翻译,译者:寸志,范洪春,kmokidd,姜天意 数月前,Facebook 对外宣布了正在开发的 React Native 框架,这个框架允许你使用 JavaScript 开发原生 ...

随机推荐

  1. LeetCode第十题-正则表达式匹配

    Regular Expression Matching 问题简介:给定字符串,给定匹配模式,判断字符串是否满足匹配模式 问题详解:一共有两种特殊模式: ‘.’ 匹配任何单个字符 ‘*’ 匹配前面元素的 ...

  2. jsonp跨域ajax跨域get方法

    原理: 就是利用<script >标签没有跨域限制的,从而达到与第三方网站通讯的目的.当需要通讯时,本站脚本创建一个<script>标签,src地址指向第三方网站的的一个网址. ...

  3. Lua中__index和__newindex实践

    [具有默认值的table] 我们都知道,table中的任何字段的默认值都是nil,但是通过元表,我们可以很容易的修改这一规定,代码如下: function setDefault(tb, default ...

  4. JS 对Array集合排序的方法

    我的业务是根据距离的远近经行一个排序: 第一种方法:冒泡排序 排序前的数据是这样子的: 排序后是这样子的: 代码可以直接复制使用的: <!doctype html> <html> ...

  5. poj 3278 搜索

    描述: Farmer John has been informed of the location of a fugitive cow and wants to catch her immediate ...

  6. 修正锚点跳转位置 避免头部fixed固定部分遮挡

    如下锚点标签: <div id="id1"> <span class="kkAnchor"></span> 正文正文正文正文 ...

  7. Linux 查看负载内存

    负载   内存     1.作用 top命令用来显示执行中的程序进程,使用权限是所有用户. 2.格式 top [-] [d delay] [q] [c] [S] [s] [i] [n] 3.主要参数 ...

  8. zabbix4.0构建实录

    [Nginx] #wget -O /etc/yum.repos.d/epel.repo http://mirrors.aliyun.com/repo/epel-7.repo [root@centos ...

  9. UOJ#405. 【IOI2018】组合动作

    原文链接https://www.cnblogs.com/zhouzhendong/p/IOI2018Day1T1.html 题解 首先二分一下,花费2次操作求出第一位的字符. 假设第一个字符是 Y,答 ...

  10. Prime Distance POJ - 2689 (数学 素数)

    The branch of mathematics called number theory is about properties of numbers. One of the areas that ...