Не удается импортировать компонент в React-Native

Question

Я новичок в react-native и пробую свое первое приложение с expo-cli. Я пытаюсь использовать реагирующую навигацию для перехода между экранами, но у меня возникают проблемы при попытке импортировать компоненты моего экрана, а именно HomeScreen.

Я получаю следующую ошибку:

Unable to resolve "/screens/HomeScreen.js" from "App.js"

Моя структура папок выглядит следующим образом: https://i.imgur.com/c2gqTFt.png

Это мое приложение. js файл:

import { StatusBar } from 'expo-status-bar';
import React from 'react';
import { StyleSheet, Text, View } from 'react-native';
import { createStackNavigator } from '@react-navigation/stack';
import HomeScreen from '/screens/HomeScreen';

const navigator = createStackNavigator(
{
    Home: HomeScreen
},
{
  initialRouteName:'Home',
  defaultNavigationOptions:
  {
    title:'App'
  }

}
);

Компонент My HomeScreen:

import * as React from 'react';
import { View, Text } from 'react-native';


export default function HomeScreen()
{
  return (
    <View style={styles.container}>
      <Text>Pero esto que es</Text>
      <StatusBar style="auto" />
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },
});

Answer 1

import HomeScreen from './screens/HomeScreen';

Добавление ./ в начале означает, что вы начинаете перемещаться внутри папки, в которой находитесь.

Если вам нужно go назад на один шаг вперед, вы должны добавить ../

Итак, начиная с App.js, теперь вам нужно перейти к папке, в которой находится ваш HomeScreen.