无法在 GitHub Pages 上发布 Reactjs 网站：错误 404

Question

我正在使用 ReactJS 创建一个网站，并尝试使用 github 页面在 github 上发布。但是我遇到了问题：

我在这里看到了所有与 404 相关的问题，但没有运气。

我的

package.json

：

{
  "name": "mywebsite_(copy)",
  "version": "0.1.0",
  "homepage": "https://mywebsite.github.io/mywebsite", 
  "private": false,
  "dependencies": {
    "@testing-library/jest-dom": "^5.16.5",
    "@testing-library/react": "^13.4.0",
    "@testing-library/user-event": "^13.5.0",
    "@types/jest": "^29.5.0",
    "@types/node": "^16.11.14",
    "@types/react": "^18.0.28",
    "@types/react-dom": "^18.0.11",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "react-router-dom": "^6.2.1",
    "react-scripts": "^5.0.1",
    "serve": "^14.2.3",
    "web-vitals": "^2.1.4"
  },
  "scripts": {
    "start": "react-scripts start",
    "predeploy": "npm run build",
    "deploy": "gh-pages -d build",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject",
    "live": "nodemon server.js"
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  },
  "nodemonConfig": {
    "ext": "js css"
  },
  "devDependencies": {
    "gh-pages": "^6.1.1"
  }
}

这是我在

App.js

的路线：

<Routes>
      <Route path="/" element={<Homepage />} />
      <Route path="/aboutus" element={<AboutUs />} />
      <Route path="/appointment" element={<Form/>} />
</Routes>

我尝试更改 package.json:

1. 主页属性例如

   "homepage": "https://mywebsite.github.io/mywebsite"

   或者

   "homepage": "./"

   或者

   "homepage": "https://github.com/mywebsite/mywebsite.github.io"

2. 私有财产

   "private": false

   或者

   "private": true

所以我不确定问题是什么。也许路由器有问题，或者是 build/index.html 中的绝对链接而不是相对链接？

Answer 1

在您的 Github 存储库设置中，在“页面”->“构建和部署”->“分支”下，您需要告诉 Github 您要为页面站点使用哪个发布源分支。否则，您将得到一个后备 404 页面，因为 Github 不知道为页面内容提供哪个源分支。

您可以在 here 的 Github 页面文档中阅读更多相关信息。