Some styles are not applied in release, but works perfectly in debug.

[aismartchat]

Describe the bug
NativeWind Version: 4.0.1
React Native Version: 0.73.6

In release configuration looks like some styles are randomly not being applied.
Looks very strange especially because in other places same styles are applied correctly.

This is example of the code, but it looks totally random.
For example here, w-32, h-32 are not applied, while other styles applied correctly. For example colors, border-colors, as well as rounded-full are applied correctly.

export const FullScreenLoadingModal = ({ isLoading = true, loadingMessage = ""}) => {
return (

<Pressable className="flex-1 justify-center items-center" style={{ backgroundColor: 'rgba(0, 0, 0, 0.7)' }}>

<LottieView
source={require("./../../assets/loading.json")}
style={{ width: 300, height: 300, marginLeft: -110, marginTop: -110}}
autoPlay
loop
/>



);
};

In other screens, mt-16, mt-20 are not applied, and again, the rest of the styles are applied correctly.

To Reproduce
Steps to reproduce the behavior:
In Debug configuration everything is working correctly as expected.
In Release configuration, some styles seems are not applied.

Question
Could you please explain how to debug the release build.
Is it possible to output the final NativeWind styles output for each of the files in project?

[cyanChill]

If you're talking about <LottieView />, you might need to wrap it with a cssInterop since it's a 3rd party component that uses the style prop.

• https://www.nativewind.dev/v4/api/css-interop
• https://www.nativewind.dev/v4/guides/third-party-components

For example:

import LottieView from 'lottie-react-native';
import { cssInterop } from "nativewind";

const WrappedLottieView = cssInterop(LottieView , { className: "style" });

And use it as:

<WrappedLottieView {...props} className="" />

You can also try updating NativeWind since the latest version is 4.0.36.

[rlesniak]

I have similiar issue, its related to #886