React Native error: "Failed to compile Syntax Error None of these files exist: " - react-native

Question

I'm taking a React Native tutorial and I'm getting the error:
Failed to compile
Syntax Error
None of these files exist:
*..\..\..\..\..\.src\screens\ListScreen(.native|ios.ts|.native.ts|.ts|.ios.tsx|.native.tsx|tsx|ios.js|native.js|.js|.ios.jsx|.native.jsx|.jsx|.ios.json|native.json|.json)
*..\..\..\..\..\.src\screens\ListScreen\index(.native|ios.ts|.native.ts|.ts|.ios.tsx|.native.tsx|tsx|ios.js|native.js|.js|.ios.jsx|.native.jsx|.jsx|.ios.json|native.json|.json)
There are only three files being imported into my App.js file and the error shows when I import ListScreen from ".src/screens/ListScreen". When I comment out that line the error goes away. I have no idea what's causing it.
Below is the code from the four JS files and the folder structure. It's a course on Udemy and no one else has encountered it so I'm not sure what I'm doing wrong since all the other files were authored by the instructor which I downloaded at the beginning of the course.
App.js
import { createAppContainer } from "react-navigation";
import { createStackNavigator } from "react-navigation-stack";
import HomeScreen from "./src/screens/HomeScreen";
import ComponentsScreen from "./src/screens/ComponentsScreen";
import ListScreen from ".src/screens/ListScreen";
const navigator = createStackNavigator(
{
Home: HomeScreen,
Components: ComponentsScreen,
},
{
initialRouteName: "Components",
defaultNavigationOptions: {
title: "App",
}
}
);
export default createAppContainer(navigator);
HomeScreen.js
import React from 'react';
import { Text, StyleSheet } from 'react-native';
const HomeScreen = () => {
return <Text style={styles.text}>ProjectWherewoof</Text>
};
const styles = StyleSheet.create({
text: {
fontSize: 30,
},
});
export default HomeScreen;
ComponentsScreen.js
import { Text, StyleSheet, View } from "react-native";
const ComponentsScreen = () => {
const greeting = <Text>Getting Started with React Native</Text>;
const myname = 'Arturo';
return (
<View>
<Text style={styles.greetingStyle}>{greeting}</Text>
<Text style={styles.nameStyle}>My name is {myname} !!!</Text>
</View>
);
};
const styles = StyleSheet.create({
greetingStyle: {
fontSize: 45,
},
nameStyle: {
fontSize: 20,
}
});
export default ComponentsScreen;
ListScreen.js
import React from 'react';
import { Text, StyleSheet } from 'react-native';
const ListScreen = () => {
return <Text>List Screen</Text>;
};
const styles = StyleSheet.create({});
export default ListScreen;
Folder Structure:
Folder Structure snapshot

Answer 1

You're missing a slash in import ListScreen from ".src/screens/ListScreen";. .src is not a directory in your project.
It should be import ListScreen from "./src/screens/ListScreen"; (or just "src/screens/ListScreen";)