如何将Swift（OC）现有项目集成到现有的reactNative项目中

一、准备材料：1.现有的Swift（OC）项目；2.现有的ReactNative项目；3.Cocoapods

二、步骤：

（1） 首先进入ReactNative项目根目录下，删除node_modules和package-lock.json两个文件。（注：这两个文件通过后期npm install可重新生成）

（2） 进入ios文件夹删除原有的项目，将自己现有的项目直接复制过来。

（3） 打开控制台，进入到ReactNative项目根目录下,npm install即可。

（4） 控制台进入ios文件中，open podfile，编辑这也是最为关键的一步，输入以下：

 source 'https://github.com/CocoaPods/Specs.git'

platform :ios, '11.4' # swift项目，必须有这个

use_frameworks!    # swift项目，必须有这个

inhibit_all_warnings!

target 'SampleApp' do

 # 'node_modules'目录一般位于根目录中

 # 但是如果你的结构不同，那你就要根据实际路径修改下面的`:path`

 pod 'React', :path => '../node_modules/react-native', :subspecs => [

   'Core',

   'CxxBridge', # 如果RN版本>= 0.45则加入此行

   'DevSupport', # 如果RN版本>= 0.43，则需要加入此行才能开启开发者菜单

   'RCTText',

   'RCTAnimation',

   'RCTImage',

   'RCTNetwork',

   'RCTWebSocket', # 这个模块是用于调试功能的'RCTLinking',

   'RCTLinkingIOS',

   'ART',

   'RCTActionSheet',

   'RCTGeolocation',

   'RCTPushNotification',

   'RCTSettings',

   'RCTVibration',

   'RCTBlob',

 # 在这里继续添加你所需要的RN模块

 ]

 pod 'RNGestureHandler', :path => "../node_modules/react-native-gesture-handler"

 pod 'RNCAsyncStorage', :path => "../node_modules/@react-native-community/async-storage"

 pod 'RNVectorIcons', :path => "../node_modules/react-native-vector-icons"

 # 如果你的RN版本>= 0.42.0，请加入下面这行

 pod "yoga", :path => "../node_modules/react-native/ReactCommon/yoga"

 # 如果RN版本>= 0.45则加入下面三个第三方编译依赖

 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'

end

说明：其实这是一种变相的去ReactNative项目中的node_modules去寻找对应的组件库，你其实可以试试通过原来ReactNative帮你创建的项目中去打开iOS工程，对着那些ReactNative库进行 show in Finder，你会发现其实也是通过链接到node_modules这样的方式去寻找组件库的，【当然手动集成其实也是这个原理】，若运行过程中会出现Native module cannot be null，说明你的ReactNative用到了一些iOS专有的系统组件库，但是你的iOS项目中却缺少了这部分的组件库，你可以根据实际需要的库，进行pod即可，具体参考上面的podfile文件，其路径仔细研究，其实你完全可以自己根据上面的path路径，通过打开文件夹的方式一级级点进去看看，就明白什么意思了。

（5） pod install 即可。

（6） 打开iOS工程，对AppDelegate.swift 进行相关配置，如下：

在此方法下

“func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {”

写如下代码：

 window = UIWindow(frame: UIScreen.main.bounds)

//192.168.3.25是手机与你当前服务（node服务）所连的ip保持一致即可

 let jsCodeLocation = URL(string: "http://192.168.3.25:8081/index.bundle?platform=ios")

       let rootView = RCTRootView(

           bundleURL: jsCodeLocation,

           moduleName: "emotion",// emotion：该名字与ReactNative那边保持一致，否则会报错，具体不再阐述，很容易解决的。

           initialProperties: nil,

           launchOptions: nil

       )

       let rootVC = UIViewController()

       rootVC.view = rootView

       window?.rootViewController = rootVC

       window?.makeKeyAndVisible()

 return true

（7） 最后，运行：先通过控制台进入ReactNative根目录下，输入npm start 来启动服务，然后打开iOS工程，运行。此处可能会运行，但实际运行后，可能会出错，由于字体缺失，或者其他的隐形问题（暂未遇到），就字体缺失问题阐述下，进入Xcode，点击File-> Workspace Setting->Build System->选择Legacy Build System，再尝试运行，若字体库出来却显示红色，可能需要手动导入字体库了（目前我是这么做的），在node_module文件夹中的native-base中的Fonts复制并黏贴到iOS工程目录下，再进行Add到项目中即可。