Skip to content

Uncompiled files - until i save them again with a new className? #253

@kristian-nst

Description

@kristian-nst

Describe the bug
Upgrading from expo 52 to 54 has issues, so i made a completely new expo 54 app, and then copy over all my files
after i got the app running again, no styles were compiled
but every time i changed a file, and save it, that file's classes became compiled. But when i undo the change to the previous classname, all those styles disappear again

Here's an example with just 1 class

Screen.Recording.2025-12-22.at.2.29.15.PM.mov

Expected behavior
All files matching the regex pattern in the config should compile when i start the bundler

Additional context

{
  "name": "planner.travel-native-54",
  "version": "1.0.0",
  "main": "expo-router/entry",
  "scripts": {
    "start": "expo start",
    "android": "expo run:android",
    "ios": "expo run:ios",
    "web": "expo start --web"
  },
  "dependencies": {
    "@babel/plugin-proposal-export-namespace-from": "7.18.9",
    "@expo/vector-icons": "^15.0.3",
    "@formatjs/intl-getcanonicallocales": "2.5.3",
    "@formatjs/intl-locale": "4.2.5",
    "@formatjs/intl-pluralrules": "5.3.5",
    "@gorhom/bottom-sheet": "5.2.8",
    "@hookform/resolvers": "3.9.1",
    "@react-native-async-storage/async-storage": "2.2.0",
    "@react-native-community/blur": "4.4.1",
    "@react-native-community/datetimepicker": "8.4.4",
    "@react-native-community/netinfo": "11.4.1",
    "@react-navigation/native": "^7.0.14",
    "@sentry/react-native": "~7.2.0",
    "@shopify/flash-list": "2.0.2",
    "@tailwindcss/forms": "0.5.9",
    "@tanstack/query-persist-client-core": "5.66.0",
    "@tanstack/react-query": "5",
    "@ts-rest/core": "3.52.1",
    "@ts-rest/react-query": "3.52.1",
    "app-icon-badge": "0.1.2",
    "class-variance-authority": "0.7.0",
    "clsx": "2.1.1",
    "date-fns": "4.1.0",
    "exome": "2.6.0",
    "expo": "~54.0.30",
    "expo-build-properties": "~1.0.10",
    "expo-constants": "~18.0.12",
    "expo-dev-client": "~6.0.20",
    "expo-device": "~8.0.10",
    "expo-font": "~14.0.10",
    "expo-haptics": "~15.0.8",
    "expo-image": "~3.0.11",
    "expo-linear-gradient": "~15.0.8",
    "expo-linking": "~8.0.11",
    "expo-location": "~19.0.8",
    "expo-router": "~6.0.21",
    "expo-status-bar": "~3.0.9",
    "expo-system-ui": "~6.0.9",
    "expo-tracking-transparency": "~6.0.8",
    "expo-updates": "~29.0.15",
    "expo-web-browser": "~15.0.10",
    "immer": "10.1.1",
    "nativewind": "4.2.1",
    "radash": "12.1.0",
    "react": "19.1.0",
    "react-dom": "19.1.0",
    "react-hook-form": "7.53.2",
    "react-native": "0.81.5",
    "react-native-bootsplash": "^6.3.11",
    "react-native-drawer-layout": "4.1.7",
    "react-native-gesture-handler": "~2.28.0",
    "react-native-get-random-values": "1.11.0",
    "react-native-pager-view": "6.9.1",
    "react-native-picker-select": "9.3.1",
    "react-native-reanimated": "~4.1.1",
    "react-native-safe-area-context": "~5.6.0",
    "react-native-screens": "~4.16.0",
    "react-native-svg": "15.12.1",
    "react-native-toast-message": "2.3.3",
    "react-native-ui-datepicker": "3.1.2",
    "react-native-worklets": "0.7.1",
    "tailwind-merge": "2.5.5",
    "tailwindcss": "3.4.17",
    "uuid": "11.0.3",
    "zod": "3.23.8"
  },
  "devDependencies": {
    "@babel/core": "^7.26.0",
    "@mocks-server/main": "4.1.0",
    "@playwright/test": "1.54.2",
    "@stylistic/eslint-plugin-jsx": "2.12.1",
    "@stylistic/eslint-plugin-ts": "2.12.1",
    "@types/bun": "1.2.2",
    "@types/react": "~19.1.10",
    "@types/react-dom": "~19.1.7",
    "@typescript-eslint/eslint-plugin": "8.18.2",
    "@typescript-eslint/parser": "7.2.0",
    "babel-plugin-module-resolver": "5.0.2",
    "eslint": "8.56.0",
    "eslint-config-expo": "~10.0.0",
    "eslint-config-prettier": "9.1.0",
    "eslint-plugin-10x": "1.5.2",
    "eslint-plugin-import": "2.31.0",
    "eslint-plugin-prettier": "5.2.1",
    "eslint-plugin-react": "7.37.3",
    "eslint-plugin-simple-import-sort": "12.1.1",
    "eslint-plugin-storybook": "0.10.1",
    "eslint-plugin-typescript-sort-keys": "3.3.0",
    "jest": "29.7.0",
    "jest-expo": "~54.0.16",
    "prettier": "3.4.2",
    "prettier-plugin-tailwindcss": "0.6.9",
    "react-native-svg-transformer": "1.5.2",
    "react-test-renderer": "18.3.1",
    "typescript": "~5.9.2"
  },
  "patchedDependencies": {
    "@ts-rest/[email protected]": "patches/@ts-rest%[email protected]"
  },
  "private": true
}

and

/** @type {import('tailwindcss').Config} */
module.exports = {
  content: ['./src/**/*.{js,jsx,ts,tsx}'],
  presets: [require('nativewind/preset')],
  plugins: [require('@tailwindcss/forms')],
}

Yes, i have run bun expo start --clear

Any ideas what this could be? 🤔

Metadata

Metadata

Assignees

No one assigned

    Labels

    needs reproductionIssue needs a minimal reproduction before it can be worked on

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions