How to Resolve C++ Exception Errors (ios) and (android) i get compiling js failed in React Native:

Question

android Click to view Android error

Ios Click to view IOS error

Those two errors occure at the same time both on android and on ios i do not know how they started

Metro config

const { getDefaultConfig } = require('expo/metro-config');

module.exports = (async () => {
  const defaultConfig = await getDefaultConfig(__dirname);
  
  return {
    ...defaultConfig,
    transformer: {
      ...defaultConfig.transformer,
      routerRoot: 'src', // Adjust 'src' to your actual routes directory
    },
    // Add any additional custom configurations here
  };
})();

App.jsx

import React, { useEffect, useState } from 'react'
import {
  SafeAreaView, StatusBar, Text,
} from 'react-native'
import * as SecureStore from 'expo-secure-store';


import { NavigationContainer, DefaultTheme } from '@react-navigation/native'
import { createNativeStackNavigator } from '@react-navigation/native-stack'

import SplashScreen from './src/screens/Splash'
import SignInScreen from './src/screens/Signin'
import SignUpScreen from './src/screens/Signup'
import MainContainer from './src/MainContainer'
import ChattyScreen from './src/screens/Chatty'
import useGlobal from './src/core/global'



const LightTheme = {
  ...DefaultTheme,
  colors: {
    ...DefaultTheme.colors,
    background: 'white'
  }
}


const Stack = createNativeStackNavigator()


function App() {
  const initialized = useGlobal(state => state.initialized)
  const authenticated = useGlobal(state => state.authenticated)

  const init = useGlobal(state => state.init)
  useEffect(() => {
    // Function to check if tokens exist
    const checkTokens = async () => {
      try {
        const accessToken = await SecureStore.getItemAsync('accessToken');
        const refreshToken = await SecureStore.getItemAsync('refreshToken');
        if (accessToken && refreshToken) {
          // Tokens exist, user is authenticated
          setAuthenticated(true);
        }
        // App initialization complete
        setInitialized(true);
      } catch (error) {
        console.error('Error checking tokens:', error);
      }
    };

    // Perform token check on app initialization
    checkTokens();
  }, []);
  useEffect(() => {
    init()
  }, [])

  return (
    <NavigationContainer theme={LightTheme}>
      
      <StatusBar barStyle='dark-content' />
      <Stack.Navigator screenOptions={{
          headerShown: false, // Ensure headers are hidden by default
          // Other default navigation options here
        }}>
        
      {!initialized ? (
        <Stack.Screen name="Splash" component={SplashScreen} />
      ) : !authenticated ? (
        <>
          <Stack.Screen name="SignIn" component={SignInScreen} />
          <Stack.Screen name="SignUp" component={SignUpScreen} />
        </>
      ) : (
        <Stack.Screen name="Home" component={MainContainer} />
      )}
      </Stack.Navigator>
    </NavigationContainer>
  )
}


export default App

I have tried to delete modules folder and i have also tried to delete my entire temp folder …i have tried reset cache .

Can i please get help . I do not know how the error started but is been 24 hours now trying to fix this bug

I also tried to re install the dependencies below is the code of dependencies

{
  "expo": {
    "name": "chatty",
    "slug": "snack-591c41d7-a6b6-4341-be65-da8ccb127164",
    "version": "1.0.0",
    "orientation": "portrait",
    "icon": "./src/assets/CHATTY-LOGO-copy-BLUEuijn.png",
    "userInterfaceStyle": "light",
    "splash": {
      "image": "./src/assets/splash.png",
      "resizeMode": "contain",
      "backgroundColor": "#ffffff"
    },
    "assetBundlePatterns": [
      "**/*"
    ],
    "ios": {
      "supportsTablet": true
    },
    "android": {
      "adaptiveIcon": {
        "foregroundImage": "./src/assets/adaptive-icon.png",
        "backgroundColor": "#ffffff"
      }
    },
    "web": {
      "favicon": "./src/assets/favicon.png"
    }
  }
}