I just updated my Expo App (managed workflow) from SDK49 to 51. With the SDK49, it was working fine, however, after the update, the App is stuck on the splash screen. The problem appears only in production mode (in Testflight).
Here are my dependencies:
"dependencies": {
"@apollo/client": "^3.10.4",
"@expo/vector-icons": "^14.0.2",
"@react-native-async-storage/async-storage": "^1.23.1",
"@react-navigation/bottom-tabs": "^6.5.20",
"@react-navigation/native": "^6.1.17",
"@react-navigation/stack": "^6.3.29",
"@stripe/stripe-react-native": "0.37.2",
"axios": "^1.5.1",
"expo": "^51.0.11",
"expo-apple-authentication": "^6.4.1",
"expo-asset": "^10.0.8",
"expo-auth-session": "^5.5.2",
"expo-av": "^14.0.5",
"expo-crypto": "^13.0.2",
"expo-dev-client": "^4.0.15",
"expo-device": "^6.0.2",
"expo-font": "^12.0.7",
"expo-haptics": "^13.0.1",
"expo-image-manipulator": "^12.0.5",
"expo-image-picker": "^15.0.5",
"expo-linking": "^6.3.1",
"expo-location": "^17.0.1",
"expo-notifications": "^0.28.7",
"expo-random": "^14.0.1",
"expo-secure-store": "^13.0.1",
"expo-splash-screen": "^0.27.5",
"expo-updates": "^0.25.16",
"expo-web-browser": "^13.0.3",
"geolib": "^3.3.4",
"graphql": "^15.8.0",
"graphql-request": "^6.1.0",
"react": "18.2.0",
"react-dom": "18.2.0",
"react-is": "^18.2.0",
"react-native": "0.74.2",
"react-native-gesture-handler": "^2.16.2",
"react-native-get-random-values": "^1.11.0",
"react-native-maps": "1.14.0",
"react-native-modal": "^13.0.1",
"react-native-particles": "^0.0.8",
"react-native-progress": "^5.0.1",
"react-native-responsive-screen": "^1.4.2",
"react-native-safe-area-context": "4.10.1",
"react-native-screens": "3.31.1",
"react-native-svg": "15.2.0",
"react-native-web": "^0.19.12",
"react-native-webview": "13.8.6",
"react-redux": "^9.1.2",
"redux": "^5.0.1"
},
"devDependencies": {
"@babel/core": "^7.24.0"
},
"private": true
}
and my App.js:
export default function App(props) {
const [isReady, setIsReady] = React.useState(false);
const [publishableKey, setPublishableKey] = React.useState(null);
const LoadFonts = async () => {
await useFonts();
};
React.useEffect(() => {
try{
LoadFonts().then(() => {
GetPublishableKey().then(res => {
if (res.data && res.data.publishableKey){
setPublishableKey(res.data.publishableKey)
setIsReady(true)
}
})
.catch(err => console.log(err))
})
}
catch(err){
setIsReady(true)
}
}, [])
React.useEffect(() => {
if (isReady) {
SplashScreen.hideAsync();
}
}, [isReady]);
if (!isReady) {
return null;
}
// Define your HTTP link including the headers
const httpLink = new HttpLink({
uri: ' my GraphQL API endpoint',
headers: {
// here are my headers
},
});
const client = new ApolloClient({
link: from([httpLink]),
cache: new InMemoryCache(),
});
return (
<ApolloProvider client={client}>
<Provider store={store}>
<StripeProvider publishableKey={publishableKey}>
<Connection />
</StripeProvider>
</Provider>
</ApolloProvider>
);
};
When I run : npx expo-doctor@latest,
I get: Didn’t find any issues with the project!
I also tried to delete the node_modules and to run npm install, but nothing works..
this error is particularly annoying because I have to redo was builds to check if possible solution works…
Would anyone have an idea of which dependency / part of the code is breaking the code during production?
Thanks,
Hugo