IOS app build with expo crashes instantly after splashscreen

Question

I have coded an app using expo and built the app with EAS. The app runs fine when I launch it on Expo Go, but crashes instantly when running the production build on a simulator, and I have no clue why.

Things I have tried, but without success:

• I have gone through every installed package online to see if any extra configuration is need.
• I have tried to create a minimal example, so this is what my expo-router entry files looks like:

// index.tsx
import { SafeAreaView, Text } from "react-native";

export default function Index() {
  return (
    <SafeAreaView>
      <Text className="text-blue">Sterk.</Text>
    </SafeAreaView>
  );
}

This is my root _layout.tsx file:

// _layout.tsx

import { Stack } from "expo-router";
import { GestureHandlerRootView } from "react-native-gesture-handler";
import { BottomSheetModalProvider } from "@gorhom/bottom-sheet";
import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
import { useMigrations } from "drizzle-orm/expo-sqlite/migrator";
import { db, expodb } from "@/db";
import migrations from "@/drizzle/migrations";
import { useDrizzleStudio } from "expo-drizzle-studio-plugin";
import { useToast } from "@/hooks";
import { useEffect } from "react";
import { useColorScheme } from "react-native";
import { getHeaderStyle } from "@/utils";

export default function RootLayout() {
  const queryClient = new QueryClient();
  const { showToast } = useToast();
  const { error } = useMigrations(db, migrations);
  useEffect(() => {
    if (error) {
      showToast("Failed to migrate the database", "error");
      console.log(error);
    }
  }, [error, showToast]);

  useDrizzleStudio(expodb);
  const colorScheme = useColorScheme();

  return (
    <QueryClientProvider client={queryClient}>
      <GestureHandlerRootView>
        <BottomSheetModalProvider>
          <Stack>
            <Stack.Screen name="index" options={{ headerShown: false }} />
            <Stack.Screen name="(tabs)" options={{ headerShown: false }} />
            <Stack.Screen
              name="(onboarding)"
              options={{ headerShown: false }}
            />
            <Stack.Screen name="welcome" options={{ headerShown: false }} />
            <Stack.Screen
              name="paywall"
              options={{
                headerShown: false,
                presentation: "fullScreenModal",
              }}
            />
            <Stack.Screen
              name="(modals)/exercises/edit"
              options={{
                ...getHeaderStyle(colorScheme),
                headerTitle: "Edit Exercise",
                headerLargeTitle: true,
                presentation: "fullScreenModal",
              }}
            />
            <Stack.Screen
              name="(modals)/exercises/new"
              options={{
                ...getHeaderStyle(colorScheme),
                headerTitle: "New Exercise",
                headerLargeTitle: true,
                presentation: "fullScreenModal",
              }}
            />
            <Stack.Screen
              name="(modals)/legal/privacyPolicy"
              options={{
                ...getHeaderStyle(colorScheme),
                headerTitle: "Privacy Policy",
                headerLargeTitle: true,
                presentation: "modal",
              }}
            />
            <Stack.Screen
              name="(modals)/legal/termsOfService"
              options={{
                ...getHeaderStyle(colorScheme),
                headerTitle: "Terms of Service",
                headerLargeTitle: true,
                presentation: "modal",
              }}
            />
          </Stack>
        </BottomSheetModalProvider>
      </GestureHandlerRootView>
    </QueryClientProvider>
  );
}

app.json:

{
  "expo": {
    "name": "Sterk",
    "slug": "sterk",
    "version": "1.0.0",
    "userInterfaceStyle": "light",
    "orientation": "portrait",
    "scheme": "myapp",
    "icon": "./assets/app/icon.png",
    "ios": {
      "supportsTablet": false,
      "bundleIdentifier": <Left out on purpose>
    },
    "android": {
      "adaptiveIcon": {
        "backgroundColor": "#ffffff"
      },
      "package": <Left out on purpose>
    },
    "web": {
      "bundler": "metro",
      "output": "static"
    },
    "plugins": [
      "expo-router",
      "expo-sqlite"
    ],
    "experiments": {
      "typedRoutes": true,
      "reactCompiler": true
    },
    "newArchEnabled": true,
    "extra": {
      "router": {
        "origin": false
      },
      "eas": {
        "projected": <Left out on purpose>
      }
    },
    "owner": <Left out on purpose>
  }
}

package.json:

{
  "name": "sterk",
  "main": "expo-router/entry",
  "version": "1.0.0",
  "scripts": {
    "start": "expo start",
    "reset-project": "node ./scripts/reset-project.js",
    "android": "expo start --android",
    "ios": "expo start --ios",
    "web": "expo start --web",
    "test": "jest --watchAll",
    "lint": "expo lint"
  },
  "jest": {
    "preset": "jest-expo"
  },
  "dependencies": {
    "@gorhom/bottom-sheet": "^5.0.6",
    "@shopify/flash-list": "1.7.1",
    "@shopify/react-native-skia": "1.5.0",
    "@tanstack/react-query": "^5.51.11",
    "babel-plugin-inline-import": "^3.0.0",
    "babel-plugin-react-compiler": "^19.0.0-beta-a7bf2bd-20241110",
    "clsx": "^2.1.1",
    "drizzle-orm": "^0.37.0",
    "expo": "~52.0.20",
    "expo-dev-client": "^5.0.7",
    "expo-drizzle-studio-plugin": "0.1.0",
    "expo-haptics": "~14.0.0",
    "expo-linking": "~7.0.3",
    "expo-router": "~4.0.15",
    "expo-splash-screen": "~0.29.18",
    "expo-sqlite": "~15.0.4",
    "expo-symbols": "~0.2.0",
    "millify": "^6.1.0",
    "nativewind": "^2.0.11",
    "react": "18.3.1",
    "react-compiler-runtime": "^19.0.0-beta-0dec889-20241115",
    "react-native": "0.76.5",
    "react-native-gesture-handler": "~2.20.2",
    "react-native-reanimated": "~3.16.1",
    "react-native-safe-area-context": "4.12.0",
    "react-native-screens": "~4.4.0",
    "react-native-svg": "15.8.0",
    "react-native-web": "~0.19.13",
    "tailwindcss": "^3.3.2",
    "tailwind-merge": "^2.4.0",
    "zustand": "^4.5.4"
  },
  "devDependencies": {
    "@babel/core": "^7.20.0",
    "@types/jest": "^29.5.12",
    "@types/react": "~18.3.12",
    "@types/react-test-renderer": "^18.0.7",
    "drizzle-kit": "^0.29.1",
    "eslint": "^8.57.0",
    "eslint-config-expo": "~8.0.1",
    "eslint-plugin-react-compiler": "^0.0.0-experimental-92aaa43-20240919",
    "expo-doctor": "^1.12.4",
    "jest": "^29.2.1",
    "jest-expo": "~52.0.2",
    "prettier": "^3.3.3",
    "prettier-plugin-tailwindcss": "^0.6.5",
    "react-test-renderer": "18.2.0",
    "typescript": "~5.3.3"
  },
  "expo": {
    "doctor": {
      "reactNativeDirectoryCheck": {
        "listUnknownPackages": false
      }
    }
  },
  "private": true
}

metro.config.js:

const { getDefaultConfig } = require("@expo/metro-config");
const {
  wrapWithReanimatedMetroConfig,
} = require('react-native-reanimated/metro-config');

const defaultConfig = getDefaultConfig(__dirname);
defaultConfig.resolver.sourceExts.push("cjs");
defaultConfig.resolver.sourceExts.push('sql'); // <--- add this

module.exports = wrapWithReanimatedMetroConfig(defaultConfig);

babel.config.js:

module.exports = function (api) {
  api.cache(true);
  return {
    presets: ["babel-preset-expo"],
    plugins: ["nativewind/babel", ["inline-import", { "extensions": [".sql"] }], 'react-native-reanimated/plugin'],
  };
};

What can I try next?