Downside Description
I’ve a React Native challenge that runs completely on Android, however exhibits solely a clean white display when working on iOS simulator. When constructing and working via XCode, I can see the app launches however solely shows a white display.
Setting Particulars
- React Native Model: 0.74.5 (upgraded from 0.69.3)
- iOS Improvement Goal: 13.4
- Node.js Model: v18.20.8 (through 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 information.
Invalidating (mum or dad: (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]
Challenge 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 (@obtainable(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:@"principal" withExtension:@"jsbundle"];
#endif
}
Podfile (Key Components)
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 () => ({
remodel: {
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/elements/error/ErrorBoundary'
const Software = () => (
)
AppRegistry.registerComponent(appName, () => Software)
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
- ✅ Android: App runs completely – all UI elements and navigation work
- ❌ iOS Simulator: Solely exhibits white/clean display
- Clear builds: Deleted
Pods
, , ranpod set up
Podfile.lock
- Metro cache reset:
npx react-native begin --reset-cache
- Simulator reset: Erased all content material and settings
Questions
- Why does the React Bridge get invalidated instantly on iOS however work fantastic on Android?
- Is the dSYM warning associated to the clean display subject?
- May there be a problem with the improve from RN 0.69.3 to 0.74.5 affecting iOS particularly?
- Are there any iOS-specific configuration points within the present setup?
Any insights on debugging this iOS-specific subject could be enormously appreciated! Thanks upfront.