React Native Background image doesn't display on actual device

I have a project on React Native CLI. There is a login screen, that contains a bg image. It works on simulator as Xcode or Android Studio but on real device background image doesnt display. How can it be fixed? Image should be local, not as url

import { StyleSheet, View, TouchableOpacity, ImageBackground } from 'react-native';import { Text } from 'react-native-paper';import { useNavigation } from '@react-navigation/native';import { FormProvider, useForm } from 'react-hook-form';import { loginValidateSchema } from '@utils/validation';import { LoginSection } from './components/LoginSection';import { zodResolver } from '@hookform/resolvers/zod';import { useUserManagementApi } from '@service/UserManagementApi';import { Button } from '@components/Button';import { theme } from '@theme/theme';import { Loading } from '@screens/loading/Loading';import { ScreenNames } from '@router/CustomStack';export type AuthenticationCredentials = {  email: string;  password: string;};const LoginForm = () => {  const methods = useForm<AuthenticationCredentials>({    resolver: zodResolver(loginValidateSchema),  });  const navigation = useNavigation<any>();  const { loginUser } = useUserManagementApi();  const handleSubmitCredentials = methods.handleSubmit((values: AuthenticationCredentials) => {    loginUser.mutateAsync({ email: values.email, password: values.password });  });  return (<ImageBackground      source={require('../../assets/authenticate_bg.jpg')}      style={styles.background}      resizeMode="cover"><View style={styles.container}><FormProvider {...methods}><LoginSection /></FormProvider></View>      {loginUser.isPending ? (<Loading marginTop={24} />      ) : (<><View style={styles.buttonContainer}><Button variant="secondary" action={handleSubmitCredentials}>              Log in</Button><TouchableOpacity onPress={() => navigation.navigate(ScreenNames.Registration)}><Text style={styles.registration}>Go to Registration</Text></TouchableOpacity></View></>      )}</ImageBackground>  );};const styles = StyleSheet.create({  buttonContainer: {    marginTop: 24,    marginHorizontal: 50,    gap: 10,  },  registration: {    textAlign: 'center',    color: theme.criticalColor.color,    marginTop: 10,  },  container: {    marginTop: 50,    marginHorizontal: 30,    gap: 10,  },  background: {    flex: 1,    width: "100%",    height:"100%"  },});export { LoginForm };

I tried preload image asynchronously, declared image as variable but it didnt help