marklawlor / nativewind

React Native utility-first universal design system - powered by Tailwind CSS
https://nativewind.dev
MIT License
4.3k stars 233 forks source link

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

Open aismartchat opened 1 month ago

aismartchat commented 1 month ago

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 ( <Modal visible={isLoading} transparent={true} animationType="fade"

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

); };

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 commented 1 month ago

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.

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 commented 3 weeks ago

I have similiar issue, its related to #886