javascript - Github Pages 中是否有允许您将单页应用程序的所有内容重定向到 index.html 的配置？

Question

我正在尝试发布在本地运行良好的 SPA 应用程序，但是当我将其推送到 Github Pages 时，如果您直接导航到它们，内部页面不会注册。

例如 http://USER.github.io/PROJECT_NAME/ 有效，但 http://USER.github.io/PROJECT_NAME/about 无效，因为没有重定向或重写。 index.html 位于项目的根目录。

Answer 1

如果你正在创建 React 应用程序并且你想在你的 gh 页面中使用 Browser router 解决方案是在你的根目录中创建 404.html 文件并将 index.html 中的所有内容复制到404.html 在你构建你的 react-app 之后。

当用户尝试访问您的页面时，例如 https://successtar.github.io/teamwork/如果用户尝试访问 https://successtar.github.io/teamwork/foo，GitHub 将提供您的 index.html 页面。 ，因为它不存在，GitHub 将提供与 index.html 具有相同内容的 404.html 页面，这样你就可以让你的 React 应用程序按预期工作。

这是示例的源代码 https://github.com/successtar/teamwork/tree/gh-pages

更新

您可以在每次运行 npm run build 时自动执行该过程以自动生成 404.html 文件。

第一步:为跨平台命令安装 shx 如下 npm install shx --save-dev

第二步:转到脚本 block 中的 package.json 将 "build": "react-scripts build" 替换为 "build": "react-scripts build && shx cp build/index.html build/404.html"

就是这样。

每当您运行 npm run build 时，都会自动生成 404.html 文件。