Search code examples
iosreact-nativeexpostack-tracereact-native-google-mobile-ads

React-Native iOS app is crashing immediately upon launch when creating development build


I have created an app for iOS using React Native. I've gotten the app to a point where it works on the iPhone simulator via the Expo App. It even works when creating a build of the app to distribute using TestFlight. Now, I want to add Google Ads into the app. However, I've learned that Google Ads won't work via an Expo build. Instead one has to create a development build to test the ads in the app and see how they look.

I've also finally been able to compile a successful development build using eas (expo application services). When I install the app on the simulator and try to open it however, the app crashes almost immediately and I don't know why. I have tried deciphering the symbolicated crash report, but I have not been able to figure out what could be causing the error. It looks like it has something to do with the user interface.

Below is the thread where the app crashes:

Thread 0 Crashed::  Dispatch queue: com.apple.main-thread
0   libsystem_kernel.dylib                 0x11324a14a __pthread_kill + 10
1   libsystem_pthread.dylib                0x1132abebd pthread_kill + 262
2   libsystem_c.dylib                   0x7ff80016dd1c abort + 133
3   libc++abi.dylib                     0x7ff8002c6d12 abort_message + 241
4   libc++abi.dylib                     0x7ff8002b951a demangling_terminate_handler() + 266
5   libobjc.A.dylib                     0x7ff800061fba _objc_terminate() + 96
6   libc++abi.dylib                     0x7ff8002c616b std::__terminate(void (*)()) + 6
7   libc++abi.dylib                     0x7ff8002c6126 std::terminate() + 54
8   libdispatch.dylib                   0x7ff8001796ec _dispatch_client_callout + 28
9   libdispatch.dylib                   0x7ff80017d1e2 _dispatch_block_invoke_direct + 508
10  FrontBoardServices                  0x7ff807a8b3a7 __FBSSERIALQUEUE_IS_CALLING_OUT_TO_A_BLOCK__ + 30
11  FrontBoardServices                  0x7ff807a8b281 -[FBSMainRunLoopSerialQueue _targetQueue_performNextIfPossible] + 188
12  FrontBoardServices                  0x7ff807a8b3cf -[FBSMainRunLoopSerialQueue _performNextFromRunLoopSource] + 19
13  CoreFoundation                      0x7ff800429ff3 __CFRUNLOOP_IS_CALLING_OUT_TO_A_SOURCE0_PERFORM_FUNCTION__ + 17
14  CoreFoundation                      0x7ff800429f35 __CFRunLoopDoSource0 + 157
15  CoreFoundation                      0x7ff800429732 __CFRunLoopDoSources0 + 215
16  CoreFoundation                      0x7ff800423e67 __CFRunLoopRun + 919
17  CoreFoundation                      0x7ff8004236ed CFRunLoopRunSpecific + 557
18  GraphicsServices                    0x7ff8103ba08f GSEventRunModal + 137
19  UIKitCore                           0x7ff805cdf6ee -[UIApplication _run] + 972
20  UIKitCore                           0x7ff805ce416e UIApplicationMain + 123
21  LeftOff                                0x10f870380 main + 96
22  dyld_sim                               0x112d3a3e0 start_sim + 10
23  dyld                                   0x113d57366 start + 1942

I have been trying to solve this for some days now and could really use some help. I have tried changing versions of dependencies in my app too, with a focus on those that manage the UI. For example, I have changed packages such as react-native-ranimated, react-navigation/stack, react-native-gesture-handler, and react-native-screens to name a few. Nothing has worked so far. Please help.

For more context, I use

eas build --profile development-simulator --platform ios --local

in the terminal to create the development build. This allows me to create a .tar.gz file which I can unzip and then install on the simulator.

This is my eas.json file:

{
  "cli": {
    "version": ">= 7.6.0"
  },
  "build": {
    "development": {
      "developmentClient": true,
      "distribution": "internal"
    },
    "preview": {
      "distribution": "internal"
    },
    "production": {
      "ios": {
        "image": "latest"
      }
    },
    "development-simulator": {
      "developmentClient": true,
      "distribution": "internal",
      "ios": {
        "simulator": true
      }
    }
  },
  "submit": {
    "production": {}
  }
}

Here is my package.json file:

{
  "name": "mycoolapp",
  "version": "1.0.0",
  "scripts": {
    "start": "expo start --dev-client",
    "android": "expo run:android",
    "ios": "expo run:ios",
    "web": "expo start --web"
  },
  "dependencies": {
    "@babel/preset-env": "^7.24.5",
    "@babel/runtime": "^7.24.5",
    "@expo/config-plugins": "^8.0.4",
    "@expo/prebuild-config": "^7.0.4",
    "@react-native-community/masked-view": "^0.1.11",
    "@react-native-masked-view/masked-view": "^0.2.9",
    "@react-navigation/bottom-tabs": "^6.5.11",
    "@react-navigation/native": "^6.1.9",
    "@react-navigation/native-stack": "^6.9.17",
    "@react-navigation/stack": "^6.3.20",
    "apisauce": "^3.0.1",
    "core-js": "^3.35.1",
    "expo": "^51.0.8",
    "expo-build-properties": "~0.12.1",
    "expo-constants": "~16.0.2",
    "expo-dev-client": "~4.0.15",
    "expo-font": "~12.0.6",
    "expo-modules-core": "^1.12.12",
    "expo-secure-store": "~13.0.1",
    "expo-splash-screen": "^0.20.5",
    "expo-status-bar": "~1.12.1",
    "firebase": "^10.7.1",
    "formik": "^2.4.5",
    "hermes-engine": "^0.11.0",
    "jwt-decode": "^4.0.0",
    "postinstall": "^0.10.3",
    "react": "18.2.0",
    "react-inspector": "^6.0.2",
    "react-native": "^0.74.2",
    "react-native-device-info": "^10.12.0",
    "react-native-gesture-handler": "^2.16.2",
    "react-native-google-mobile-ads": "^13.3.0",
    "react-native-reanimated": "^3.12.0",
    "react-native-safe-area-context": "^4.10.4",
    "react-native-screens": "^3.31.1",
    "react-native-svg": "^15.3.0",
    "yup": "^1.3.3"
  },
  "devDependencies": {
    "@babel/core": "^7.24.0",
    "react-native-dotenv": "^3.4.11"
  },
  "private": true
}

Solution

  • It turns out, I needed to use

    npx expo prebuild --clean

    to clear information related to previous builds I had created. I also removed all of the previous zip files and builds from my app's root directory. After that, I could use

    eas build --profile dev-sim --platform ios --local

    and the build worked!

    This is a snippet from my full Apple Crash report. Showing it for more context:

    Last Exception Backtrace:
    0   CoreFoundation  … __exceptionPreprocess + 226
    1   libobjc.A.dylib … objc_exception_throw + 48
    2   CoreFoundation  … -[NSException initWithCoder:] + 0
    3   LlllOoo         … -[RCTAppDelegate bundleURL] + 52
    4   LlllOoo         … -[EXAppDelegateWrapper createRCTRootViewFactory] + 65
    5   LlllOoo         … -[RCTAppDelegate application:didFinishLaunchingWithOptions:] + 223
    6   LlllOoo         … -[EXAppDelegateWrapper application:didFinishLaunchingWithOptions:] + 112
    7   LlllOoo         … -[AppDelegate application:didFinishLaunchingWithOptions:] + 176
    8   UIKitCore       … -[UIApplication _handleDelegateCallbacksWithOptions:isSuspended:restoreState:] + 297
    …
    

    I learned that the RCTAppDelegate (which stands for React App Delegate I believe) was causing the NSException (or NeXTSTEP Exception) to appear. I wondered why the RCTAppDelegate would cause an exception. After hours of searching and doing research on RN, Apple crash reports, etc. I thought to myself: maybe the bundleURL is wrong or missing, thus causing the syntax or language exception. I think RCTAppDelegate was trying to find the correct bundleURL, but got confused when it found multiple bundleURLs in the root directory.

    For Google Ads, another error was occurring that I didn't realize until testing a new app I created from scratch. In addition to having this

    "expo": {
    ...
    },
     "react-native-google-mobile-ads":{
         "android_app_id": "ca-app-pub-456456...",
         "ios_app_id": "ca-app-pub-789789..."
     }
    }
    

    at the bottom of my app.json, I also needed the Google Mobile Ads App ID in my ios key above, like so

    "expo":{    
     ...
     "ios":{
       ...
       "config":{
        "googleMobileAdsAppId": "ca-app-pub-1231231213..."
       }
     },
     ...
     }
    ...