在 Github Pages 上部署后只有主页有效

Only home page works after deploy on GithubPages

我构建并部署了我的 React 应用程序。 React App 仅在 Github 页上显示起始页。当我尝试切换页面时出现 404 错误。 App With Localhost 完美运行。我不知道该怎么办。到目前为止没有任何帮助。我的代码如下:

package.json

{
  "name": "HotelLiveDemo",
  "homepage": "https://JakubSoldek.github.io/HotelLiveDemo/",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "cra-template": "1.1.2",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "react-helmet": "^6.1.0",
    "react-router-dom": "^6.0.2",
    "react-script-tag": "^1.1.2",
    "react-scripts": "4.0.3",
    "styled-components": "^5.3.3"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject",
    "predeploy": "npm run build",
    "deploy": "gh-pages -d build"
  },

路由器

const Router = () => {
    return (
        <BrowserRouter basename={process.env.PUBLIC_URL}>
            <Routes>
                <Route path='/' element={<AboutUs />} />
                <Route path='/hotel' element={<Hotel />} />
                <Route path='/ContactUs' element={<ContactUs />} />
                <Route path='/RoomsPage' element={<RoomsPage />} />

            </Routes>
        </BrowserRouter>
    );
};

部署到 Github 页面时,您应该在此处使用 HashRouter 而不是 BrowserRouter。 Github 页面不支持浏览器历史记录,因此 Github 页面对从何处导航感到困惑。

看到 this article and also the "Add routing to our application" section here 的结尾。