React Native - XCode（RNTextDetector）上的应用程序构建失败

Question

I am working on my company's old React Native project and trying to run the app on the simulator.

These are the steps what I have done in order:

1. I checked out the code from git
2. Run command npm install to install node_modules
3. go into ios folder and run pod install to create Pods folder
4. Open XCode and run the app

At the 4th step, the app was almost successfully built but then the errors occured in file RNTextDetector.m (the path is {Root}/node_modules/rn-text-detector/ios/RNTextDetector.m ). Most of them are "Use of undeclared identifier 'xxx'". Here are the errors:

Here is my package.json:

{
  "name": "xxx",
  "version": "1.0.0",
  "private": true,
  "scripts": {
    "android": "react-native run-android",
    "ios": "react-native run-ios",
    "start": "react-native start",
    "test": "jest",
    "lint": "eslint ."
  },
  "dependencies": {
    "@notifee/react-native": "^3.0.4",
    "@react-native-community/art": "^1.2.0",
    "@react-native-community/async-storage": "^1.11.0",
    "@react-native-community/datetimepicker": "^3.5.2",
    "@react-native-community/masked-view": "^0.1.10",
    "@react-native-community/progress-bar-android": "^1.0.3",
    "@react-native-community/progress-view": "^1.0.3",
    "@react-native-community/toolbar-android": "0.2.1",
    "@react-native-firebase/app": "^12.9.0",
    "@react-native-firebase/messaging": "^12.9.0",
    "@react-native-picker/picker": "^2.2.1",
    "@react-navigation/material-top-tabs": "^6.2.1",
    "@react-navigation/native": "^6.0.1",
    "@react-navigation/stack": "^6.2.1",
    "axios": "^0.24.0",
    "babel-preset-react-native": "^4.0.1",
    "expo-local-authentication": "^12.1.1",
    "flow-bin": "^0.137.0",
    "jest": "^26.6.3",
    "jwt-decode": "^3.1.2",
    "moment": "^2.29.3",
    "moment-timezone": "^0.5.34",
    "native-base": "^2.13.12",
    "react": "^17.0.1",
    "react-native": "^0.64.2",
    "react-native-biometrics": "^2.1.4",
    "react-native-calendars": "^1.1267.0",
    "react-native-camera": "^3.35.0",
    "react-native-chart-kit": "^6.12.0",
    "react-native-elements": "^2.0.4",
    "react-native-file-viewer": "^2.1.1",
    "react-native-fs": "^2.16.6",
    "react-native-gesture-handler": "^1.10.3",
    "react-native-image-crop-picker": "^0.32.2",
    "react-native-image-picker": "^4.8.3",
    "react-native-keyboard-aware-scroll-view": "^0.9.1",
    "react-native-linear-gradient": "^2.5.6",
    "react-native-modal": "^11.5.6",
    "react-native-pager-view": "^5.4.24",
    "react-native-pdf": "^6.2.0",
    "react-native-picker-select": "^8.0.0",
    "react-native-pie-chart": "^2.0.2",
    "react-native-reanimated": "^1.9.0",
    "react-native-rename": "^2.9.0",
    "react-native-render-html": "^6.3.4",
    "react-native-safe-area-context": "^3.0.2",
    "react-native-screens": "^3.13.1",
    "react-native-simple-toast": "^1.1.2",
    "react-native-svg": "^12.1.1",
    "react-native-swipe-list-view": "^3.2.9",
    "react-native-tab-view": "^3.1.1",
    "react-native-vector-icons": "^7.0.0",
    "react-navigation": "^4.4.0",
    "react-query": "^3.34.2",
    "react-redux": "^7.2.0",
    "redux": "^4.0.5",
    "redux-devtools-extension": "^2.13.8",
    "redux-thunk": "^2.3.0",
    "rn-fetch-blob": "^0.12.0",
    "rn-text-detector": "0.0.8",
    "toggle-switch-react-native": "^3.3.0",
    "typescript": "^3.9.7"
  },
  "devDependencies": {
    "@babel/core": "^7.12.9",
    "@babel/runtime": "^7.12.5",
    "@react-native-community/eslint-config": "^2.0.0",
    "babel-jest": "^26.6.3",
    "babel-plugin-root-import": "^6.5.0",
    "babel-plugin-styled-components": "^1.10.7",
    "eslint": "^7.14.0",
    "metro-react-native-babel-preset": "^0.64.0",
    "react-test-renderer": "^17.0.1"
  },
  "jest": {
    "preset": "react-native"
  }
}

Answer 1

After I looked into RNTextDetector's original repository (rn-text-detector), I found this thread and try following their code and it works!

The solution is to add @import MLKitTextRecognitionCommon; in file RNTextDetector.m as shown below:

#import "RNTextDetector.h"

#import <React/RCTBridge.h>
#import <React/RCTLog.h>

@import MLKitTextRecognitionCommon;
@import MLKitTextRecognition;
@import MLKitVision;

@implementation RNTextDetector
...