Repo: Navigation context error triggered by NativeWind `shadow-*` toggle in Expo Router (Expo 53)

[SammyTBrains]

Summary

I’m providing a minimal, runnable reproduction for a navigation error that occurs intermittently when using NativeWind with Expo Router and React Navigation.

This follows up on my earlier report and community discussion; this time a clean repo is included. #1536

🔗 Repo link

Repo: https://github.com/SammyTBrains/nativewind-shadow-switch

Environment

• expo: 53.0.20
• expo-router: 5.1.4
• react-native: 0.79.5
• nativewind: ^4
• react-native-gesture-handler: ~2.24.0
• react-native-reanimated: 3.17.4
• react-native-safe-area-context: 5.4.0
• react-native-screens: 4.11.1

Steps to reproduce

1. Install dependencies
2. Start the app
3. On the home screen, toggle Phone/Email a few times (both buttons use shadow-sm and bg-white/30)
4. Tap Go to next screen
5. Intermittently, navigation fails with:

Couldn’t find a navigation context

✅ Expected

Navigation should work consistently after toggling.

❌ Actual

After toggling the conditional className with shadow-* utilities, navigation occasionally breaks with the above error.

Notes and workaround

• Removing shadow-* (e.g., shadow-sm) and opacity shorthand (bg-white/30) from the conditional toggle eliminates the issue.
• Using equivalent inline styles for shadows/opacity avoids the crash.

Related links

• Previous issue I opened: https://github.com/nativewind/nativewind/issues/1536
• Similar Expo thread/comment: https://github.com/expo/expo/issues/38191#issuecomment-3129106823

---

Thanks for taking a look 🙏.

[marklawlor]

The reproduction is invalid.

It is:

• Missing a Metro config
• Has an invalid Babel config
• Missing a lockfile

[ethan-krich]

I'm also experiencing this even without react navigation installed.

[Ilanbeebey]

I'm also experiencing this

[mauroxdev]

I'm also having this problem

[0x1337ak]

yep removing shadow- did solve it for me going for style for now

[mustafaersoyer]

same here

[smak0412]

same here

[sajadghawami]

also having this issue with the switch. removing the shadow-did not work

[kasperisme]

same here

[notKeion]

Same here

[kascoder]

Same here, removing shadow-sm helped

[ryanbae94]

same here

[mustafaersoyer]

is there any update?

[dlebedynskyi]

issue is reproducable. Not 100% of what classes are causing this but full repo on default expo 53 app with nativewind

[MrPand-21]

same here with dependencies:

{
    "expo": "^54.0.10",
    "expo-camera": "~17.0.8",
    "expo-contacts": "~15.0.8",
    "expo-haptics": "~15.0.7",
    "expo-router": "^6.0.8",
    "expo-sensors": "~15.0.7",
    "expo-splash-screen": "^31.0.10",
    "expo-status-bar": "^3.0.8",
    "nativewind": "4.2.1",
    "react": "19.1.0",
    "react-dom": "19.1.0",
    "react-native": "0.81.4",
    "react-native-calendars": "^1.1313.0",
    "react-native-gesture-handler": "~2.28.0",
    "react-native-reanimated": "4.1.2",
    "react-native-safe-area-context": "5.6.1",
    "react-native-worklets": "0.6.0",
    "tailwindcss": "3.4.17",
    "typescript": "~5.9.2",
}

[0x1337ak]

@MrPand-21 i think the issue might be with the react-native-css-interop add this to your package json

  "overrides": {
    "nativewind": {
      "react-native-css-interop": "0.2.0"
    }
  }

remove node_modules and lock file then install it again seems to fix it for me also it get rid of the reanimated warning message worklet plugin

[MrPand-21]

@0x1337ak Thanks for the suggestion yet adding that broke my app, also it didn't resolve the issue with css stylings as well

My expo version is 54, i know this thread is about expo 53 but i shared it regradless, it could be that your solution works for expo v 53

[danstepanov]

I'll aim to properly reproduce this with npx rn-new --nativewind --expo-router (Nativewind v4 + Expo SDK 54) but it would help a lot if someone could produce one before I do.

[otang]

Following - same issue