Classes are not applied before doing fast reloading

[francesco-buscicchio]

Describe the bug I set up nativewind on my project in RN with Expo and typescript, the nativewind style is not applied until I modify a class within classname. I am attaching some code parts that might be helpful in understanding the problem

Versions "expo": "~50.0.14", "nativewind": "^2.0.11", "react": "18.2.0",

Babel.config.js

module.exports = function (api) {
  api.cache(true);
  return {
    presets: ["babel-preset-expo"],
    plugins: ["nativewind/babel"],
  };
};

Tailwind.config.js

/** @type {import('tailwindcss').Config} */
module.exports = {
  content: ["./App.{js,jsx,ts,tsx}", "./screens/**/*.{js,jsx,ts,tsx}"],
  theme: {
    extend: {
      colors: {
//colors
      },
    },
  },
  plugins: [],
};

styles.scss

@tailwind base;
@tailwind components;
@tailwind utilities;

app.tsx

import React, { useState } from "react";
import { withExpoSnack } from "nativewind";
import { NavigationContainer } from "@react-navigation/native";
import { createNativeStackNavigator } from "@react-navigation/native-stack";
import SplashScreen from "./screens/SplashScreen";
import { useFonts } from "expo-font";
import { Lato_400Regular, Lato_300Light } from "@expo-google-fonts/lato";
import "./services/i18next";
import { Text } from "react-native";
import "./styles.scss";

const Stack = createNativeStackNavigator();

const App = () => {
  const [fontsLoaded] = useFonts({
    Lato_400Regular,
    Lato_300Light,
  });

  if (!fontsLoaded) {
    return <Text>Loading...</Text>;
  }
  return (
    <NavigationContainer>
      <Stack.Navigator initialRouteName="SplashScreen">
        <Stack.Screen
          name="SplashScreen"
          component={SplashScreen}
          options={{ headerShown: false }}
        />
      </Stack.Navigator>
    </NavigationContainer>
  );
};

export default withExpoSnack(App);

[pedrohamarques]

Same here

"nativewind": "^4.0.36",
"tailwindcss": "^3.4.3",
"expo": "~50.0.14",
"react": "18.2.0",
"react-native": "0.73.6",

[eduance]

Same issue here (nativewind ^4.0.36)

[mz-evia]

Is the content field in the tailwind config correctly configured? In your example the filename is app.tsx but in the content field it looks for App.{something} (lowercase vs. uppercase A).

[achtan]

@mz-evia no that's not the issue. I have correct names in my config and I have the same problem.