Не удалось разрешить путь к изображению из login.js

Я совершенно новичок в выставках и реакциях родных Я пытаюсь использовать ImageBackground Я использую его как код ниже, но получаю эту ошибку «Невозможно разрешить «./assets/back.jpg» из «app\components\Login.js»» Мое изображение уже находится в папке активов в моем проекте А также, когда я пытаюсь импортировать шрифт, я получаю ту же ошибку Нужно ли что-то импортировать перед использованием или что-то еще? Я также пробовал, не импортируя изображение и добавляя путь непосредственно к исходному свойству.

Логин.js

import React, { Component } from 'react';
import back from './assets/back.jpg';
import {
    StyleSheet,
    Text,
    View,
    TextInput,
    KeyboardAvoidingView,
    TouchableOpacity,
    AsyncStorage,
    Image,
    ImageBackground,
} from 'react-native';
import {createStackNavigator, createAppContainer} from 'react-navigation';
export default class Login extends React.Component {
    static navigationOptions = {
        header: null,
    };
    constructor(props) {
        super(props);
        this.state = {
            username:'',
            password:'',
        }
    }
    componentDidMount(){
        this._loadInitialState().done();
    }
    _loadInitialState = async () =>{
        var value = await AsyncStorage.getItem('user');
        if (value !=null){
            this.prop.navigation.navigate('Profile');
        }
    }
    render() {
        return (
            <ImageBackground source = {back} style = {styles.backImg}>
                <KeyboardAvoidingView behavior='padding' style = {styles.wrapper}>
                <View style = {styles.container}>
                <Image
                    style = {styles.logo}
                    source = {require('/MyFirst/assets/logo.png')}
                />
                <TextInput
                    style = {styles.textInput} placeholder='Username'
                    onChangeText = {(username) =>this.setState({username}) }
                    underlineColorAndroid = 'transparent'
                        />
                        <TextInput
                    style = {styles.textInput} placeholder='Password'
                    onChangeText = {(password) =>this.setState({password}) }
                    underlineColorAndroid = 'transparent'
                        />
                        <TouchableOpacity style = {styles.btn}
                    onPress = {this.login}>
                <Text style = {styles.btnText}>Login</Text>
                    </TouchableOpacity>
                    </View>
                    </KeyboardAvoidingView>
            </ImageBackground>

        );
    }
}
const styles = StyleSheet.create({
    wrapper:{
        flex:1,
    },
    container:{
        flex:1,
        alignItems:'center',
        justifyContent:'center',
        backgroundColor:'#e5ffd3',
        paddingLeft:40,
        paddingRight:40,
    },
    logo:{
        width: 250,
        height: 250,
    },
    textInput:{
        alignSelf:'stretch',
        padding:16,
        marginBottom:20,
        backgroundColor:'#fff',
        borderWidth: 1,
        borderColor: '#d6d7da',
        borderRadius: 25,
    },
    btn:{
        alignSelf:'stretch',
        backgroundColor:'#589e25',
        padding:20,
        alignItems: 'center',
        borderRadius: 25,
    },
    btnText:{
        color: '#ffffff',
    },
})

App.js

import React, { Component } from 'react';
import {
    StyleSheet,
    Text,
    View
} from 'react-native';
import {createStackNavigator, createAppContainer} from 'react-navigation';
import Login from './app/components/Login'
import Profile from './app/components/Profile'
const MainNavigator = createStackNavigator({
    Home: {screen: Login},
    Profile: {screen: Profile},
});
const App = createAppContainer(MainNavigator);
export default App;