我正在尝试使用 react-native 进行简单的路由，但我遇到了一些类似这样的错误 Failed building Javascript bundle

Question

I created one react native project and started Routing. In a project I have Pages folder, In this folder I have a Home folder in Home folder I have Home. j's, and I have another folder in Pages that is About in that I have About.js. These all are pages.

I have another folder that is Components, In that I have Navbar folder in that I have Navbar.js

I Imported this Home to Navbar.js And I have Imported Navbar to App.js. Now I am getting error like this, Unable to resolve "./Pages/Home/Home" from "Components/Navbar/Navbar.js" Failed building JavaScript bundle.

In the Pages folder I have a Home folder In that I have Home.js

This Home.js

import React, { Component } from 'react';
import { StyleSheet, Text, View } from 'react-native';

export default class Home extends Component {
    render() {
        return (
            <View>
                <Text>We have friends</Text>
            </View>
        )
    }
}

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

In the Components Folder I have a Navbar folder in that I have Navbar.js

This is Navbar.js

import { createStackNavigator } from 'react-navigation';
import Home from './Pages/Home/Home';

const Navbar = createStackNavigator({
    Home: { screen: Home },
})

export default Navbar

This is App.js

import React from 'react';
import { StyleSheet, Text, View } from 'react-native';
import Navbar from './Components/Navbar/Navbar'

export default function App() {
  return (
    <Navbar></Navbar>
  );
}

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

I want to resolve the error what I am facing. If you think still if I am not clear with my doubt or If you don't understand my question please put a comment.

Answer 1

please try something like.../Pages/Home/Home

Answer 2

I think you should install react-navigation-stack and import createStackNavigator from there, like:

import { createStackNavigator } from 'react-navigation-stack';

Namely it has changed the way to import it. Check the docs