reactjs - React：在 gh 页面上使用 react-router 进行客户端路由

Question

我在 React Create App 文档中讨论了有关使用 HTML5 pushState history API 的路由器如何在静态文件服务器上失败而不将其配置为每次都为 index.html 提供服务的问题。使用 github 页面时如何解决此问题？另外我没有使用 Create React App 或 react-scripts

我尝试将基本名称添加到 BrowserRouter 组件

<BrowserRouter basename={process.env.PUBLIC_URL}>

这里对问题的更好解释：

https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/template/README.md#serving-apps-with-client-side-routing

Answer 1

与 GitHub 页面一起使用react-router-dom时，您需要HashRouter使用BrowserRouter. 它使用#URL 的片段来保留路由，从而避免了pushState对 GH 页面的支持。

（有一些尴尬的方式来制作pushStateGitHub 页面，但我个人并不推荐它们。这里有一个指南）

Answer 2

import { HashRouter, BrowserRouter, Route, Switch } from 'react-router-dom';
ReactDOM.render(

      <HashRouter>
        <App />
      </HashRouter>,
  document.getElementById('root')
);

我使用 HashRouter 解决了这个问题。