尝试将 React 应用程序部署到 *.github.io 页面；获得 "unexpected token: '<'"

Question

我正在尝试将 React 应用程序部署到 *.github.io 页面，似乎过程中的某些内容没有正确地将 React 部署到服务器端的运行 - 我收到一个空白页面，其中包含有关意外标记“<”的错误，这对我来说表明 React 根本没有被用来解释 javascript。

这是我的 package.json:

  "name": "github-pages-page",
  "homepage": "**********.github.io",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@testing-library/jest-dom": "^5.16.4",
    "@testing-library/react": "^13.1.1",
    "@testing-library/user-event": "^13.5.0",
    "gh-pages": "^3.2.3",
    "react": "^18.0.0",
    "react-dom": "^18.0.0",
    "react-scripts": "5.0.1",
    "web-vitals": "^2.1.4"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "predeploy": "npm run build",
    "deploy": "gh-pages -d build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": [
      "react-app",
      "react-app/jest"
    ]
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}

我已经通过 Yarn 安装了 gh-pages 并正在通过 npm run deploy 部署应用程序（运行没问题），并且我指向了 Github 页到 gh-pages 分支。如果我运行 yarn start 在我的应用程序顶级目录的本地副本中，它完全按预期工作，因此应用程序本身没有任何问题 - 但是问题出在 Github 页运行正在使用它。我需要调整什么才能正确地达到运行？

Answer 1

从您的 package.json 中删除 homepage 应该可以解决您的问题。原因如下：

根据 Github docs，Github 页面有 3 种不同的类型：

组织页面
用户页面
存储库页面

You can only create one user or organization site for each account on GitHub. Project sites, whether owned by an organization or a personal account, are unlimited.

如果您创建一个名称为 <username>.github.io 的存储库，它会变成一个用户页面，看起来这就是您正在做的事情。

因此您的网站根目录变为 <username>.github.io 并且您 index.html 中的链接应该是相对于此路径的。

现在，如果您查看 gh-pages 分支中的 index.html，链接指向 /<username>.github.io/*，这是不正确的。这是因为您在 package.json.

中设置了 homepage 属性

Create-react-app docs:

By default, Create React App produces a build assuming your app is hosted at the server root. To override this, specify the homepage in your package.json

尝试将 React 应用程序部署到 *.github.io 页面；获得 "unexpected token: '<'"

Trying to deploy a React app to a *.github.io page; getting "unexpected token: '<'"

github-pages

reactjs