Пустая страница React Router

При запуске сервера на сайте отображается пустая страница. Делаю всё, как в документации, но ошибка не исчезает. Попробовал убрать <Route path="/" component={HomeScreen} exact/> из кода и просто оставить <HomeScreen />, в этот момент всё начинает рендериться как надо, но, соответственно вся суть Route не работает. Полностью удалял и заново устанавливал модули и пакеты, но всё по-прежнему не работает.

App.js

import { Container } from 'react-bootstrap'
import Header from './components/Nheader'
import Footer from './components/Nfooter'
import HomeScreen from './screens/HomeScreen'
import { BrowserRouter as Router, Route } from 'react-router-dom'


function App() {
  return (
    <Router>
      <Header />
      <main className='py-5'>
        <Container>
          <Route path="/" component={HomeScreen} exact/>
        </Container>
      </main>
      <Footer />
    </Router>
  );
}

export default App;

HomeScreen.js

import React from 'react'
import { Col, Row} from 'react-bootstrap'
import products from '../products'
import Product from '../components/Product'

function HomeScreen() {
  return (
    <div>
        <h1>Последние проданные продукты</h1>
        <Row>
            {products.map(product => (
                <Col key={product._id} sm={12} md={6} lg={4} xl={3}>
                    <Product product={product} />
                </Col>
            ))}
        </Row>
    </div>
  )
}

export default HomeScreen

Ответы (0 шт):