Swift 桥接头不导出 React Native 类型

Question

我正在尝试使用 Swift 为 React Native 应用程序创建本机 (iOS) 模块。 我想在模块上公开一个返回承诺的方法，使用RCTPromiseResolveBlock和RCTPromiseRejectBlock类型的函数，这两个函数都在 React Native 的RCTBridgeModule.h标头中声明。 但是，对于这两种类型，我的构建失败并显示消息“使用未声明的类型...”。

我已经为另一个目的创建了一个桥接头（自动使用 Xcode），所以我相信导入React/RCTBridgeModule.h是我需要提供上述类型的全部内容。 大概我配置错误，因为这不能解决问题。 我试过建立一个新项目，一切都按预期工作，但我似乎找不到会导致我的项目构建失败的差异。

一些相关的配置细节：

• 桥接标头名为<ProjectName>-Bridging-Header.h并存储在我的源目录中。 我移动了它以确认 Xcode 正在找到它（当它不在正确的位置时，构建会以不同的方式失败）。
• 桥接头的内容很简单： #import <React/RCTBridgeModule.h>
• 在我的项目构建设置中：
  • <ProjectName>-Bridging-Header.h被配置为“Objective-C Bridging Header”
  • “安装 Objective-C 兼容性标头”设置为“是”
  • “预编译桥接头”设置为“是”
• 当我输入别名时，缺少的类型项目按预期构建和运行
• 我安装了一些第三方 Swift 库（一个使用react-native link ，一个使用 Git 子模块）
• 我试过清理构建文件夹，重新安装node_modules并删除 Xcode 派生数据，但都没有效果。

我的项目是配置错误还是我错过了一些重要的东西？

Answer 1

本教程非常擅长解释如何使用 Swift 设置本机模块。 它将所有内容分解为步骤，并且很容易遵循。

https://teabreak.e-spres-oh.com/swift-in-react-native-the-ultimate-guide-part-1-modules-9bb8d054db03

1. 设置
2. 如何向 JS 公开 Swift 类
3. 如何公开静态 Swift 数据
4. 如何公开 Swift 方法
5. 如何使用回调公开方法
6. 如何将方法公开为 Promise
7. 如何公开事件发射器
8. 如何提取你的 React Native 模块

显然，您要执行的步骤是第 6 步。

这是一个代码示例。 它与上面链接中所做的非常相似。 您的桥接头应如下所示：

// <ProjectName>-Bridging-Header.h

#import "React/RCTBridgeModule.h"
#import "React/RCTEventEmitter.h"

---

你应该有名为ModuleName.m和ModuleName.swift文件。

// ModuleName.m
#import "React/RCTBridgeModule.h"
#import "React/RCTEventEmitter.h"
@interface RCT_EXTERN_MODULE(ModuleName, NSObject)
// this is how we expose the promise to the javascript side.
RCT_EXTERN_METHOD(functionWithPromise: (RCTPromiseResolveBlock)resolve rejecter: (RCTPromiseRejectBlock)reject)
@end

---

// ModuleName.swift

@objc(ModuleName)
class ModuleName: NSObject {
  @objc
  func constantsToExport() -> [AnyHashable : Any]! {
    return ["projectName": "ModuleName"]
  }

  @objc
  static func requiresMainQueueSetup() -> Bool {
    return true
  }

  @objc
  func functionWithPromise(
    _ resolve: RCTPromiseResolveBlock,
    rejecter reject: RCTPromiseRejectBlock
  ) -> Void {
    if (//something bad happens) {
      let error = NSError(domain: "", code: 200, userInfo: nil)
      reject("ERROR_FOUND", "failure", error)
    } else {
      resolve("success")
    }
  }
}

---

然后在 Javascript 端，您可以像这样访问它：

import { NativeModules } from 'react-native'

NativeModules.Counter.functionWithPromise()
    .then(res => console.log(res))
    .catch(e => console.log(e.message, e.code))