이미지가 보이지 않습니다.

작성한 코드 및 에러 메세지

import { useState, useEffect, } from 'react';

import { StatusBar } from 'expo-status-bar';

import { StyleSheet, Text, View, ScrollView, Image, TouchableOpacity, Alert, } from 'react-native';

import Loading from '../Components/Roading';

const It = '/Users/ts_4187/Desktop/java study/project-TS_4187/Image/it.jpeg'

export default function App({navigation, route}) {

const [state, setState] = useState()

const [ready, setReady] = useState(true)

const popup = () => {

Alert.alert("로그인 창")

}

useEffect(()=>{

setTimeout(()=>{

navigation.setOptions({

title: '커넥팅',

})

setReady(false)

},1000)

},[])

return ready ? <Loading/> :(

<ScrollView style={styles.container}>

<StatusBar style="auto"/>

<View style={styles.titlecontainer}>

<TouchableOpacity style={styles.loginbutton} onPress={()=>{navigation.navigate('LoginPage')}}><Text style={styles.buttontext}>login</Text></TouchableOpacity>

</View>

<Image style={styles.mainimage} source={{uri:It}}/>

</ScrollView>

);

}

const styles = StyleSheet.create({

container: {

flex: 1 ,

backgroundColor: '#ffffff',

},

titlecontainer: {

marginTop: 10,

alignItems: 'center',

justifyContent: 'center'

},

loginbutton: {

alignSelf: 'flex-end',

marginRight: 20,

padding: 5,

width: 70,

borderWidth: 3,

backgroundColor: '#000',

borderRadius: 15,

},

buttontext: {

fontSize: 20,

fontWeight: '600',

color: '#fff',

textAlign: 'center',

},

mainimage: {

marginTop: 100,

width: 100,

height: 500,

}

});