在 GitHub Pages 中部署后，React App 使用 react-router 不显示任何内容

Question

部署 React App (create-react-app) 时出现问题

它在 GitHub Pages 上工作，而且只有当我在本地项目上写时它才工作。

npm start

如果我在本地关闭项目，github 页面也会关闭。我已经部署了 3 次，但没有任何帮助。

需要你们的帮助。

代码是：

import './css/style-form.css';
import { lazy, Suspense } from 'react';
import { BrowserRouter, Routes, Route } from 'react-router-dom';
import Header from './components/Header';
import { Audio } from  'react-loader-spinner';

const Main = lazy(() => import('./components/Main'));
const LogIn = lazy(() => import('./components/LogIn'));
const Contacts = lazy(() => import('./components/Contacts'));
const Error404 = lazy(() => import('./components/Error404'));

document.title = "Salary Balance"
function App() {

  return (
    <div className='home'>
      <BrowserRouter>
        <Header />
        <Suspense fallback={<div className="body__spinner" ><Audio height = "80" width = "80" radius = "9" color = 'black' ariaLabel = 'three-dots-loading' wrapperStyle wrapperClass /></div>}>
          <Routes>
            <Route element={<LogIn />} path='/'/>
            <Route element={<Main />} path='/main'/>
            <Route element={<Contacts />} path='/contacts'/>
            <Route element={<Error404 />} path='/*'/>
          </Routes>
        </Suspense>
      </BrowserRouter>
    </div>
  );
}

export default App;

期待解决方案