Known issue: Expo Router / React Navigation crash in SDK 51 when switching tabs (clearSharedTransitionConfigForTag crash)

[marklawlor]

Known issue: Expo Router / React Navigation crash in SDK 51 when switching tabs (clearSharedTransitionConfigForTag crash)

[jpdriver]

for the record, also saw this crash when using an Expo Go + React Navigation app that

• doesn't use Expo Router
• doesn't have react-native-reanimated as a dependency

this App was started from the TypeScript template (SDK 51) and then added React Navigation.

---

as mentioned above

npx expo install react-native-reanimated

(installs v3.10.0)

and adding

import 'react-native-reanimated';

to the root App.tsx fixed it for me

[brentvatne]

An updated version of Expo Go is now available on the App Store, version 2.31.5. This includes [email protected] with the fix for this issue!

[tomekzaw]

Hey @marklawlor, thanks for reporting this issue.

This one was tricky to reproduce as it happens only if react-native-reanimated is installed as a dependency but not used directly (i.e. not imported in app JS code). That's also the reason why the crash occurs in bare expo-router app but not in the Reanimated Example app.

I've submitted a proper fix to Reanimated repository:

• software-mansion/react-native-reanimated#5975

The PR is already merged. It will be available in today's nightly release as well as published in next stable release (3.11.0).

We're sorry for inconvenience. Any chance this change will make it into SDK 51? 🙏

[FilipCorba]

If you're using Expo prebuild, please upgrade to Reanimated 3.10.1:

npx expo install [email protected]

If you're using Expo Go, please apply the workaround:

import 'react-native-reanimated';

I did this but still my app crashes on real device is there any other known issues with this package or should I look into other packages if they are the reason? I’m not getting any error just when I boot my app on Expo Go on my phone it downloads data and when it’s time to boot up it crashes and expo closes.

[marklawlor]

[email protected] and [email protected] has been published

Development clients & production builds

Please upgrade your version of react-native-reanimated and rebuild your application

Expo Go

We will need to publish a new version of Expo Go. In the meantime, please switch to using a custom development client.

[cyanle1995]

This issue still exist

[noeGitDev003]

I am having the same problem, but in my case, I use react navigation, what would be the solution? It would be very helpful if you could help me, thank you

[Antonymn0]

After upgrading to sdk 51, my app is crashing on android 7 devices. Any one experiencing a simaar issue?

[kriit24]

for the record, also saw this crash when using an Expo Go + React Navigation app that

• doesn't use Expo Router
• doesn't have react-native-reanimated as a dependency

this App was started from the TypeScript template (SDK 51) and then added React Navigation.

as mentioned above

npx expo install react-native-reanimated

(installs v3.10.0)

and adding

import 'react-native-reanimated';

to the root App.tsx fixed it for me

THANKS IT WORKED

[saeid-elio]

[email protected] has been published

Development clients & production builds

Please upgrade to [email protected] and rebuild your application

Expo Go

We will need to publish a new version of Expo Go. In the meantime, please switch to using a custom development client.

Using version 3.11.0 of react-native-reanimated keeps giving me the following error:

 ERROR  Error: [Reanimated] Mismatch between JavaScript part and native part of Reanimated (3.11.0 vs 3.10.1).

I had to revert to 3.10.1 to avoid this error.

[Luke-Pisano]

Using what @jpdriver said I was able to fix my react-navigation/native-stack navigation from going in-between screens and the navigation.goBack() method just by installing react-native-reanimated using:

npx expo install react-native-reanimated

Then I just imported the library to my App.tsx file using:

import 'react-native-reanimated';

This worked for me and I didn't have to do anything else. This is a really strange issue.

[filterdo]

After importing 'react-native-reanimated' into my App.js, I cannot get rid of the following error:

[Reanimated] Mismatch between JavaScript part and native part of Reanimated (3.11.0 vs 3.10.0)

Anyone else run into this?

[xixixao]

@brentvatne after the update Expo Go on iOS crashes for me after the bundle is built and before the app starts (this app worked before the Expo Go update (but crashed on navigation)).

I also tried reinstalling Expo Go completely but it hasn't helped.

[thearchitecturalauthority]

for the record, also saw this crash when using an Expo Go + React Navigation app that

• doesn't use Expo Router
• doesn't have react-native-reanimated as a dependency

this App was started from the TypeScript template (SDK 51) and then added React Navigation.

as mentioned above

npx expo install react-native-reanimated

(installs v3.10.0)

and adding

import 'react-native-reanimated';

to the root App.tsx fixed it for me

This fixes the issue. Thank you @jpdriver

[BRUT4LxD]

I'm using react native navigation and my iOS app was crashing during navigation.goBack(). I did what @jpdriver said and it works

[noeGitDev003]

Did you import the library in App.js?

[marklawlor]

I've updated the issue description to include instructions for non-Expo Router projects.

Important

If the instructions in the first post do not fix your issue, please create a new issue. You may be experiencing a different issue - but we cannot tell / help unless its reported properly

[jaronfort]

This is happening on one of my apps. My other app crashes at startup before anything has a chance to load.

[tomekzaw]

If you're using Expo prebuild, please upgrade to Reanimated 3.10.1:

npx expo install [email protected]

If you're using Expo Go, please apply the workaround:

import 'react-native-reanimated';

[SimonVillage]

Why won't this just get fixed? I feel like this affects a lot of users.

[Brahim-djiddi]

import 'react-native-reanimated', import it into the App.js file or into App.tsx especially those who use an expo project it works correctly.

[jhhayashi]

If you're using Expo Go, you'll have to pin the version of reanimated to the same version that's bundled into Expo Go (currently 3.10 for the version of Expo Go compatible with SDK51).

If you want to upgrade to 3.11, you'll want to build your own development client (or wait until the version in Expo Go is upgraded).

[filterdo]

@jhhayashi - So you are saying that the React Navigation Workaround that @marklawlor
provided above is not correct because it only applies to building your own development client?

Based on your comment, you can't run Expo Go unless you are on SDK 51, and Expo Router and React Navigation crash when you upgrade to SDK 51. The fix is to install [email protected], but Expo Go requires 3.10.

So Expo Go is useless now if you are using Expo Router or React Navigation, and we don't know when it will be fixed?

[jhhayashi]

The workaround posted above should work now. The newer version of reanimated should work without the workaround, but the only way to install it now is to build your own development client. Otherwise you can wait for the fix to land in Expo Go (which is what I'm doing)

[jsndowns29]

I also noticed that after upgrading to expo 51, the icons on my tab navigation aren't showing anymore, they are replaced by question marks. Do you know if there is a fix for this?

[Vortes]

After importing 'react-native-reanimated' into my App.js, I cannot get rid of the following error:

[Reanimated] Mismatch between JavaScript part and native part of Reanimated (3.11.0 vs 3.10.0)

Anyone else run into this?

having the same issue here

[kriit24]

npx expo install react-native-reanimated

use npx expo install react-native-reanimated, not npx expo install [email protected]

[Dontag]

I have upgraded to SDK 51 with react-native-reanimated 3.10.1 but still the app crashes on launch in IOS devices, I have checked the issue - software-mansion/react-native-reanimated#5975
App works fine in android

[navneet1990]

I started project using SDK 50, already running version of code with tab bar started from app/_layout.tsx, but after updating to expo SDK 51, now it started showing following image.

After updating to 51, I saw new file app/index.tsx been added, but now I am stuck here

[kriit24]

I have upgraded to SDK 51 with react-native-reanimated 3.10.1 but still the app crashes on launch in IOS devices, I have checked the issue - software-mansion/react-native-reanimated#5975 App works fine in android

try other dependencies to the same version, maybe this help

"dependencies": { "@expo/prebuild-config": "^7.0.3", "@react-native-async-storage/async-storage": "1.23.1", "@react-native-community/datetimepicker": "7.7.0", "@react-native-community/netinfo": "11.3.1", "@react-navigation/native": "^6.1.6", "@react-navigation/native-stack": "^6.9.12", "@shopify/flash-list": "1.6.4", "babel-plugin-module-resolver": "^5.0.2", "create-react-class": "^15.7.0", "crypto-js": "^4.1.1", "eas-cli": "^0.49.0", "expo": "^51.0.2", "expo-barcode-scanner": "~13.0.1", "expo-build-properties": "~0.12.1", "expo-camera": "^15.0.6", "expo-checkbox": "~3.0.0", "expo-constants": "~16.0.1", "expo-image-picker": "~15.0.4", "expo-linking": "~6.3.1", "expo-location": "~17.0.1", "expo-secure-store": "~13.0.1", "expo-status-bar": "~1.12.1", "metro-react-native-babel-preset": "^0.77.0", "project-can-json": "^1.0.1", "project-react-accordion": "^1.0.4", "project-react-mvc": "^1.5.1", "project-rest-client": "^1.2.7", "react": "18.2.0", "react-native": "0.74.1", "react-native-check-version": "^1.1.1", "react-native-device-info": "^10.13.1", "react-native-dotenv": "^3.4.9", "react-native-get-random-values": "~1.11.0", "react-native-keyboard-aware-scroll-view": "^0.9.5", "react-native-reanimated": "~3.10.1", "react-native-render-html": "^6.3.4", "react-native-safe-area-context": "4.10.1", "react-native-screens": "3.31.1", "react-native-store-version": "^1.4.1", "react-native-url-polyfill": "^2.0.0", "react-native-uuid": "^2.0.1", "react-native-webview": "13.8.6" },

[RCIStevo]

Hello everybody, since I have updated from SDK 50 - 51 I am getting error ERROR Error: Cannot find native module 'ExpoAsset', js engine: hermes .. I went to official doc : https://docs.expo.dev/versions/latest/sdk/asset/. did all the procedue - in app.json : "plugins": [
"expo-asset",
"expo-localization",
[
"expo-build-properties",
{
"ios": {
"newArchEnabled": false,
"flipper": false
},
"android": {
"newArchEnabled": false
}
}
],
"expo-font"
], but i wont go away. Here is error that i get : ERROR Error: Cannot find native module 'ExpoAsset', js engine: hermes
at App (http://127.0.0.1:8081/index.bundle//&platform=ios&dev=true&hot=false&lazy=true&transform.engine=hermes&transform.bytecode=true&transform.routerRoot=app:123194:33)
at IgniteApp
at withDevTools(IgniteApp) (http://127.0.0.1:8081/index.bundle//&platform=ios&dev=true&hot=false&lazy=true&transform.engine=hermes&transform.bytecode=true&transform.routerRoot=app:254132:27)
at RCTView
at View (http://127.0.0.1:8081/index.bundle//&platform=ios&dev=true&hot=false&lazy=true&transform.engine=hermes&transform.bytecode=true&transform.routerRoot=app:40662:43)
at RCTView
at View (http://127.0.0.1:8081/index.bundle//&platform=ios&dev=true&hot=false&lazy=true&transform.engine=hermes&transform.bytecode=true&transform.routerRoot=app:40662:43)
at AppContainer (http://127.0.0.1:8081/index.bundle//&platform=ios&dev=true&hot=false&lazy=true&transform.engine=hermes&transform.bytecode=true&transform.routerRoot=app:40505:25)
at main(RootComponent) (http://127.0.0.1:8081/index.bundle//&platform=ios&dev=true&hot=false&lazy=true&transform.engine=hermes&transform.bytecode=true&transform.routerRoot=app:118585:28). Does anybody have same error. Thank you for any input, br

[marklawlor]

Important

If the instructions in the first post do not fix your issue, please create a new issue. You may be experiencing a different issue - but we cannot tell / help unless its reported properly

Please do not ask for support for other issues - your comment will be hidden as off-topic. Please follow the correct procedure and create a new issue

[mikecr123]

for the record, also saw this crash when using an Expo Go + React Navigation app that

• doesn't use Expo Router
• doesn't have react-native-reanimated as a dependency

this App was started from the TypeScript template (SDK 51) and then added React Navigation.

as mentioned above

npx expo install react-native-reanimated

(installs v3.10.0)

and adding

import 'react-native-reanimated';

to the root App.tsx fixed it for me

that works!

[graniteroad]

I'm seeing the same issue with using react navigation with expo 51. i've attempted every suggested work around in this thread but nothing works. In addition I ran a development build, but see the same results of the app freezing and installed expo version 51.0.4. Here's my pacakage.json config

  "main": "node_modules/expo/AppEntry.js",
  "scripts": {
    "start": "expo start",
    "android": "expo start --android",
    "ios": "expo start --ios",
    "web": "expo start --web"
  },
  "dependencies": {
    "@expo/vector-icons": "^14.0.0",
    "@react-native-async-storage/async-storage": "1.23.1",
    "@react-native-community/datetimepicker": "7.7.0",
    "@react-native-picker/picker": "2.7.5",
    "@react-navigation/drawer": "^6.6.15",
    "@react-navigation/material-top-tabs": "^6.6.13",
    "@react-navigation/native": "^6.1.17",
    "@react-navigation/native-stack": "^6.9.26",
    "@reduxjs/toolkit": "^1.9.6",
    "axios": "^1.6.7",
    "core-js": "^3.35.1",
    "expo": "51.0.4",
    "expo-auth-session": "~5.5.2",
    "expo-checkbox": "~3.0.0",
    "expo-constants": "~16.0.1",
    "expo-crypto": "~13.0.2",
    "expo-device": "~6.0.2",
    "expo-image-picker": "~15.0.4",
    "expo-linear-gradient": "~13.0.2",
    "expo-linking": "~6.3.1",
    "expo-media-library": "~16.0.3",
    "expo-screen-orientation": "~7.0.4",
    "expo-secure-store": "~13.0.1",
    "expo-status-bar": "~1.12.1",
    "expo-web-browser": "~13.0.3",
    "jwt-decode": "^4.0.0",
    "lodash": "^4.17.21",
    "qs": "^6.11.2",
    "react": "18.2.0",
    "react-dom": "18.2.0",
    "react-native": "0.74.1",
    "react-native-datepicker": "^1.7.2",
    "react-native-drawer-layout": "^3.3.0",
    "react-native-dropdown-menu": "*",
    "react-native-dropdown-select-list": "*",
    "react-native-elements": "*",
    "react-native-gesture-handler": "~2.16.1",
    "react-native-keyboard-aware-scroll-view": "^0.9.5",
    "react-native-modal-datetime-picker": "^17.1.0",
    "react-native-pager-view": "6.3.0",
    "react-native-paper": "*",
    "react-native-reanimated": "3.10.1",
    "react-native-safe-area-context": "4.10.1",
    "react-native-screens": "3.31.1",
    "react-native-select-dropdown": "*",
    "react-native-tab-view": "^3.5.2",
    "react-native-vector-icons": "*",
    "react-native-webview": "13.8.6",
    "react-redux": "^8.1.2",
    "redux": "^4.2.1",
    "redux-thunk": "^2.4.2"
  },
  "devDependencies": {
    "@babel/core": "^7.24.0"
  },
  "private": true
}

[ECKSTASYY]

I'm seeing the same issue with using react navigation with expo 51. i've attempted every suggested work around in this thread but nothing works. In addition I ran a development build, but see the same results of the app freezing and installed expo version 51.0.4. Here's my pacakage.json config

  "main": "node_modules/expo/AppEntry.js",
  "scripts": {
    "start": "expo start",
    "android": "expo start --android",
    "ios": "expo start --ios",
    "web": "expo start --web"
  },
  "dependencies": {
    "@expo/vector-icons": "^14.0.0",
    "@react-native-async-storage/async-storage": "1.23.1",
    "@react-native-community/datetimepicker": "7.7.0",
    "@react-native-picker/picker": "2.7.5",
    "@react-navigation/drawer": "^6.6.15",
    "@react-navigation/material-top-tabs": "^6.6.13",
    "@react-navigation/native": "^6.1.17",
    "@react-navigation/native-stack": "^6.9.26",
    "@reduxjs/toolkit": "^1.9.6",
    "axios": "^1.6.7",
    "core-js": "^3.35.1",
    "expo": "51.0.4",
    "expo-auth-session": "~5.5.2",
    "expo-checkbox": "~3.0.0",
    "expo-constants": "~16.0.1",
    "expo-crypto": "~13.0.2",
    "expo-device": "~6.0.2",
    "expo-image-picker": "~15.0.4",
    "expo-linear-gradient": "~13.0.2",
    "expo-linking": "~6.3.1",
    "expo-media-library": "~16.0.3",
    "expo-screen-orientation": "~7.0.4",
    "expo-secure-store": "~13.0.1",
    "expo-status-bar": "~1.12.1",
    "expo-web-browser": "~13.0.3",
    "jwt-decode": "^4.0.0",
    "lodash": "^4.17.21",
    "qs": "^6.11.2",
    "react": "18.2.0",
    "react-dom": "18.2.0",
    "react-native": "0.74.1",
    "react-native-datepicker": "^1.7.2",
    "react-native-drawer-layout": "^3.3.0",
    "react-native-dropdown-menu": "*",
    "react-native-dropdown-select-list": "*",
    "react-native-elements": "*",
    "react-native-gesture-handler": "~2.16.1",
    "react-native-keyboard-aware-scroll-view": "^0.9.5",
    "react-native-modal-datetime-picker": "^17.1.0",
    "react-native-pager-view": "6.3.0",
    "react-native-paper": "*",
    "react-native-reanimated": "3.10.1",
    "react-native-safe-area-context": "4.10.1",
    "react-native-screens": "3.31.1",
    "react-native-select-dropdown": "*",
    "react-native-tab-view": "^3.5.2",
    "react-native-vector-icons": "*",
    "react-native-webview": "13.8.6",
    "react-redux": "^8.1.2",
    "redux": "^4.2.1",
    "redux-thunk": "^2.4.2"
  },
  "devDependencies": {
    "@babel/core": "^7.24.0"
  },
  "private": true
}

+1, need to do company work, do we have an eta on fix?

[ramnoah]

I upgraded my project to SDK 51, and that's when the troubles began with the app's launch on iOS devices when i was using react navigation. This issue only occurred me on iOS, but I managed to solve it with the help of this guide. Works fine on other operating systems.

[graniteroad]

I upgraded my project to SDK 51, and that's when the troubles began with the app's launch on iOS devices when i was using react navigation. This issue only occurred me on iOS, but I managed to solve it with the help of this guide. Works fine on other operating systems.

Can you walk through the exact steps you took to solve the issue?

[ramnoah]

I upgraded my project to SDK 51, and that's when the troubles began with the app's launch on iOS devices when i was using react navigation. This issue only occurred me on iOS, but I managed to solve it with the help of this guide. Works fine on other operating systems.

Can you walk through the exact steps you took to solve the issue?

Of course, the steps is on the order that give us the user, my explanation is this:

1. Create a layout route

Create a layout route for a directory, for this create a file named _layout.js in the directory.
Here type this:

import { Slot } from 'expo-router';

export default function HomeLayout() {
  return <Slot />;
}

2. Install react-native-reanimated
In a terminal of your Project type this:

npx expo install react-native-reanimated

3 Add this line on the code of the layout that previously created:

import 'react-native-reanimated'

Should see like this:

import { Slot } from 'expo-router';
import 'react-native-reanimated'

export default function HomeLayout() {
  return <Slot />;
}

4 In the archive named App.js on your project add this line

import 'react-native-reanimated'

That's all 👌

[graniteroad]

An updated version of Expo Go is now available on the App Store, version 2.31.5. This includes [email protected] with the fix for this issue!

@brentvatne that did not work.. still crashes on navigation

[brentvatne]

@xixixao @graniteroad - then those may be different issues. please create a new issue with a minimal reproducible example

[Sheriff-Oladimeji]

An updated version of Expo Go is now available on the App Store, version 2.31.5. This includes [email protected] with the fix for this issue!

@brentvatne that did not work.. still crashes on navigation

The same thing, I've tried everything said and I also updated my dependencies, everything works well in Expo Go but the Android app crashes whenever I try to access pages using @react-navigation/material-top-tabs

import "expo-dev-client";
import Navigation from "./navigation";
import "react-native-reanimated"

const App = () => {
  return <Navigation />;
};

export default App;

[ottosamatori]

not working, when i want navigate on the screen that contains a navigation to a modal react-navigation on device physical ios and simulator iOS, please patch it

[brentvatne]

hey folks, i'm locking this thread because the problem that we originally created this issue for is resolved as far as we can reproduce. if you are encountering crashes related to navigation, then please create a new issue with a minimal reproducible example as per the issue report template. thank you!