I have an expo app and trying to do my first release in TestFlight. The app is built successfully in the eas servers and then delivered to Apple for deployment. Everything goes well until I download and open the app: After only like 2 seconds of rendering the register/login page, it just goes immediately blank white. I could not have found a way to address the issue or debug.
Locally, I have no problem using the app either.
I have found out that the crash is due to connecting the Meteor server and its consequences (code below). The app first renders fine, just have problem after logging in.
Here's the code of the entire app: https://github.com/eminx/librellarn/blob/main/App.js
import Meteor, { useTracker } from '@meteorrn/core';
import AsyncStorage from '@react-native-async-storage/async-storage';
Meteor.connect('wss://myapp.com/websocket', { AsyncStorage });
Any help is highly appreciated.
app.json:
{
"expo": {
"name": "librella",
"slug": "librella-app",
"version": "0.1.4",
"orientation": "portrait",
"icon": "./assets/icon.png",
"userInterfaceStyle": "light",
"splash": {
"image": "./assets/splash.png",
"resizeMode": "contain",
"backgroundColor": "#ffffff"
},
"assetBundlePatterns": ["**/*"],
"ios": {
"supportsTablet": true,
"bundleIdentifier": "com.eminx.librella",
"buildNumber": "0.1.4"
},
"android": {
"adaptiveIcon": {
"foregroundImage": "./assets/adaptive-icon.png",
"backgroundColor": "#ffffff"
},
"permissions": [
"android.permission.RECORD_AUDIO",
"android.permission.ACCESS_COARSE_LOCATION",
"android.permission.ACCESS_FINE_LOCATION",
"android.permission.FOREGROUND_SERVICE"
]
},
"web": {
"favicon": "./assets/favicon.png"
},
"plugins": [
[
"expo-image-picker",
{
"photosPermission": "The app accesses your photos to let you share them with your friends."
}
],
[
"expo-location",
{
"locationAlwaysAndWhenInUsePermission": "Allow Librella to use your location."
}
]
],
"extra": {
"eas": {
"projectId": "some-id"
}
},
"owner": "eminx"
}
}
package.json:
{
"name": "librellarn",
"version": "1.0.0",
"main": "node_modules/expo/AppEntry.js",
"scripts": {
"start": "expo start",
"android": "expo start --android",
"ios": "expo start --ios",
"web": "expo start --web",
"build:ios": "eas build --platform ios",
"build:android": "eas build --platform android",
"submit:ios": "eas submit -p ios",
"submit:android": "eas submit -p android"
},
"dependencies": {
"@babel/plugin-proposal-export-namespace-from": "^7.18.9",
"@expo/webpack-config": "^19.0.0",
"@gluestack-style/react": "^1.0.30",
"@gluestack-ui/config": "^1.0.10",
"@gluestack-ui/themed": "^1.0.33",
"@meteorrn/core": "^2.7.1",
"@react-native-async-storage/async-storage": "1.18.2",
"@react-native-community/netinfo": "9.3.10",
"@react-navigation/bottom-tabs": "^6.5.8",
"@react-navigation/drawer": "^6.6.3",
"@react-navigation/native": "^6.1.7",
"@react-navigation/native-stack": "^6.9.13",
"aws-sdk": "^2.1530.0",
"expo": "~49.0.11",
"expo-constants": "~14.4.2",
"expo-image-manipulator": "~11.3.0",
"expo-image-picker": "~14.3.2",
"expo-location": "~16.1.0",
"expo-modules-core": "~1.5.12",
"expo-status-bar": "~1.6.0",
"lucide-react-native": "^0.279.0",
"react": "18.2.0",
"react-dom": "18.2.0",
"react-hook-form": "^7.46.1",
"react-native": "0.72.6",
"react-native-gifted-chat": "^2.4.0",
"react-native-reanimated": "~3.3.0",
"react-native-web": "~0.19.6"
},
"devDependencies": {
"@babel/core": "^7.20.0",
"react-native-dotenv": "^3.4.9"
},
"private": true
}
Apparently, I needed to build and run it locally in the Xcode Simulator, which is somehow different than the Expo simulator. Then it was very simple fixes of installing a few packages, like the react-native-svg etc.
The ios building locally was not easy dealing with Cocoa Pods etc, but at the end, I managed to do it successfully and therefore could access the error console for debugging. Furthermore, I could then also upload directly to the App Store, bypassing the need to use EAS (Expo cloud build service)...