xcode – React Native iOS Simulator Exhibits Clean White Display screen – Works High-quality on Android

Downside Description

I’ve a React Native mission that runs completely on Android, however exhibits solely a clean white display when operating on iOS simulator. When constructing and operating by XCode, I can see the app launches however solely shows a white display.

Atmosphere Particulars

• React Native Model: 0.74.5 (upgraded from 0.69.3)
• iOS Growth Goal: 13.4
• Node.js Model: v18.20.8 (by way of NVM)
• Platform: macOS Sonoma (x86_64)
• XCode: Constructing for iOS simulator
• Hermes: Enabled () hermesEnabled=true

Console Logs from XCode

warning: (x86_64) /Customers/emres/Library/Developer/Xcode/DerivedData/mobile_1969-gfeqbzlnxklpkbamfxhvupxmknzj/Construct/Merchandise/Debug-iphonesimulator/mobile_1969.app/mobile_1969 empty dSYM file detected, dSYM was created with an executable with no debug data.

Invalidating  (mother or father: (null), executor: (null))

Didn't ship CA Occasion for app launch measurements for ca_event_type: 0 event_name: com.apple.app_launch_measurement.FirstFramePresentationMetric

Didn't ship CA Occasion for app launch measurements for ca_event_type: 1 event_name: com.apple.app_launch_measurement.ExtendedLaunchMetrics

nw_protocol_socket_set_no_wake_from_sleep [C2.1.1:2] setsockopt SO_NOWAKEFROMSLEEP failed [22: Invalid argument]

Mission Configuration

AppDelegate.mm

- (BOOL)utility:(UIApplication *)utility didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
  RCTAppSetupPrepareApp(utility, false);
  RCTBridge *bridge = [[RCTBridge alloc] initWithDelegate:self launchOptions:launchOptions];
  UIView *rootView = RCTAppSetupDefaultRootView(bridge, @"mobile_1969", nil, YES);
  
  if (@accessible(iOS 13.0, *)) {
    rootView.backgroundColor = [UIColor systemBackgroundColor];
  } else {
    rootView.backgroundColor = [UIColor whiteColor];
  }
  
  self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds];
  UIViewController *rootViewController = [UIViewController new];
  rootViewController.view = rootView;
  self.window.rootViewController = rootViewController;
  [self.window makeKeyAndVisible];
  return YES;
}

- (NSURL *)sourceURLForBridge:(RCTBridge *)bridge
{
#if DEBUG
  return [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index"];
#else
  return [[NSBundle mainBundle] URLForResource:@"essential" withExtension:@"jsbundle"];
#endif
}

Podfile (Key Elements)

platform :ios, '13.4'
set up! 'cocoapods', :deterministic_uuids => false

# Hermes enabled
use_react_native!(
  :path => config[:reactNativePath],
  :hermes_enabled => true,
  :fabric_enabled => flags[:fabric_enabled],
  :app_path => "#{Pod::Config.occasion.installation_root}/.."
)

Metro Config

const { getDefaultConfig, mergeConfig } = require('@react-native/metro-config');
const defaultConfig = getDefaultConfig(__dirname);

const config = {
 transformer: {
   getTransformOptions: async () => ({
     rework: {
       experimentalImportSupport: false,
       inlineRequires: true,
     },
   }),
   babelTransformerPath: require.resolve('react-native-svg-transformer'),
 },
 resolver: {
   assetExts: assetExts.filter(ext => ext !== 'svg'),
   sourceExts: [...sourceExts, 'svg'],
 },
};

module.exports = mergeConfig(defaultConfig, config);

index.js Entry Level

import React from 'react'
import 'react-native-gesture-handler'
import { AppRegistry } from 'react-native'
import App from './App'
import { title as appName } from './app.json'
import { Supplier } from 'react-redux'
import { retailer, persistor } from './src/retailer'
import { PersistGate } from 'redux-persist/integration/react'
import ErrorBoundary from './src/parts/error/ErrorBoundary'

const Utility = () => (
  
    
      
        
      
    
  
)

AppRegistry.registerComponent(appName, () => Utility)

Key Dependencies

{
  "react": "18.2.0",
  "react-native": "0.74.5",
  "react-native-gesture-handler": "^1.10.3",
  "react-native-screens": "3.27.0",
  "react-native-safe-area-context": "^1.0.0",
  "@react-navigation/native": "^5.3.0",
  "@react-navigation/stack": "^5.3.2",
  "react-redux": "^7.2.0",
  "redux-persist": "^5.10.0"
}

Steps Tried

1. ✅ Android: App runs completely – all UI parts and navigation work
2. ❌ iOS Simulator: Solely exhibits white/clean display
3. Clear builds: Deleted Pods, , ran pod set up Podfile.lock
4. Metro cache reset: npx react-native begin --reset-cache
5. Simulator reset: Erased all content material and settings

Questions

1. Why does the React Bridge get invalidated instantly on iOS however work high quality on Android?
2. Is the dSYM warning associated to the clean display subject?
3. May there be a difficulty with the improve from RN 0.69.3 to 0.74.5 affecting iOS particularly?
4. Are there any iOS-specific configuration points within the present setup?

Any insights on debugging this iOS-specific subject can be vastly appreciated! Thanks upfront.