Expo app performs a full reload when NativeWind classes changed

[hmirza1]

Describe the bug
The app completely reloads/restarts when width, height, padding, margin or color (background, text, border) NativeWind classes are added or changed. Occasionally (< 1% of the time) the change will apply without a full reload.

This breaks the development flow by losing component state and forcing the app to restart from the initial screen, making styling iterations extremely slow.

I have attached a video below to show this behaviour. The first bg color change was one of the lucky attempts that didn't reload the app. Every subsequent change did.

CleanShot.2025-06-07.at.20.05.45.mp4

Reproduction
I have created a new expo and with tabs and followed the nativewind docs for the installation. Feel free to clone the repo https://github.com/hmirza1/hassan-test-expo-nativewind.git

Expected behavior
Class changes should apply instantly via hot reload without restarting the entire app including the currently navigated page.

Additional context
Expo SDK 53
NativeWind 4.1.23
React Native 0.79.3
I am also using expo-router.

[AndreasGalster2]

nativewind/nativewind#1478

Check this issue. I see in your code that you are using error boundary. I identified that this was the issue for me. I assume you have the exact same issue. My provided repro shows how you can use a sentry error boundary in the meantime. Disable the error boundary to see if it fixes it.

[evelant]

I discovered that this is due to a quirk with the way hot reload works in react native. If you have multiple components exported from a file and they're used in several other different files you get the hard reload behavior. If you only export a single component from each file hot reload will work as expected. I think this is not a nativewind problem at all but just unclear or under-documented behavior from react native.

[emi0x7d1]

This only happens to me when I use classes I haven't used before. So I suppose it has something to do with the css generation. I have the same problem if I edit my global.css file.

[kculmback-eig]

This only happens to me when I use classes I haven't used before. So I suppose it has something to do with the css generation. I have the same problem if I edit my global.css file.

This has been our experience; adding a class that hasn't been used before causes a whole app refresh. Adding something that has been used already does a normal hot reload. I'm assuming this is do to the JIT compiler.

You can kind of get around this by white listing everything in the safelist in your tailwind config:

...(process.env.NODE_ENV === 'development' && {
  safelist: [{ pattern: /.*/ }],
}),

But this causes other problems, such as arbitrary values (e.g. something like text-[10px]) or breakpoints (md:text-lg) taking a long time to be computed.

[evelant]

I think doing that will also cause a huge file to be compiled, like several MB of js, which you probably don't want loading in your app's startup.

[kculmback-eig]

Yes, definitely not an ideal solution

[Lucass2021]

same issue here

[siyavash4812]

Any update on this? Its very annoying

[martinezguillaume]

same issue here, full reload only on new classes

[hirbod]

Did you try to remove these lines here?
https://github.com/hmirza1/hassan-test-expo-nativewind/blob/63412d778fba24565c0dbb1fb8aa596fac8bcafd/src/app/_layout.tsx#L16-L19

It's been a while, but if I remember correctly, the issue went away after. Can you confirm? @hmirza1

[Lucass2021]

Did you try to remove these lines here? https://github.com/hmirza1/hassan-test-expo-nativewind/blob/63412d778fba24565c0dbb1fb8aa596fac8bcafd/src/app/_layout.tsx#L16-L19

It's been a while, but if I remember correctly, the issue went away after. Can you confirm? @hmirza1

this seems to have solved the problem here

[1997roylee]

faced same issue by expo 54

[dimashpt]

Using expo 54 and nativewind 5. I'm experiencing the same issue, but I found a way to resolve it. The problem goes away if I remove any error boundaries. In my case, I was wrapping the root layout with Sentry.wrap. Once I removed that, the issue disappeared completely, and the hot reload works just fine.

[danstepanov]

This problem seems to be attributed to the error boundary code, I'll discuss with Mark during this week's State of Nativewind and will decide whether this should be closed based on the discussion. https://www.youtube.com/watch?v=a-Tm8z5F7Fw