使用 react-router-dom，BrowserRouter 永远不会工作，而 HashRouter 有时只能工作。为什么？答案

【问题标题】：Using react-router-dom, BrowserRouter never works and HashRouter only sometimes works. Why?使用 react-router-dom，BrowserRouter 永远不会工作，而 HashRouter 有时只能工作。为什么？
【发布时间】：2020-08-10 09:27:41
【问题描述】：

我是 React 和 react-router-dom 的新手，他们让我陷入了一个循环。

目前，HashRouter 在开发模式和生产环境中使用 Github 页面按预期工作：

import React from 'react';
import './css/main.css';
import { BrowserRouter, HashRouter, Switch, Route } from 'react-router-dom';
import AboutMe from './components/pages/AboutMe';
import MyWork from './components/pages/MyWork';
import HowToReachMe from './components/pages/HowToReachMe';
import LandingPage from './components/pages/LandingPage';

export default function App() {
  return (
    <HashRouter>
      <Switch>
        <Route exact path="/" component={LandingPage} />
        <Route path="/AboutMe" component={AboutMe} />
        <Route path="/MyWork" component={MyWork} />
        <Route path="/HowToReachMe" component={HowToReachMe} />
      </Switch>
    </HashRouter>     
  );
}

但是，使用 BrowserRouter 会导致空白的灰色或白色页面没有错误：

  return (  
      <BrowserRouter>
        <Switch>
          <Route exact path="/" component={LandingPage} />
          <Route path="/AboutMe" component={AboutMe} />
          <Route path="/MyWork" component={MyWork} />
          <Route path="/HowToReachMe" component={HowToReachMe} />
        </Switch>
      </BrowserRouter>
  );

现在，当我尝试将我的自定义域与 github 页面一起使用时，我会得到一个空白的白色页面，同时使用 BrowserRouter 或 HashRouter 都没有错误。我确信我正确设置了域，因为您仍然可以使用开发工具 (https://connor-mote.com/) 查看 head 标签。

为什么 BrowserRouter 或 HashRouter 不能与使用 GitHub 页面的自定义域一起使用？

Github Repo Link

【问题讨论】：

标签： reactjs github-pages react-router-dom

【解决方案1】：

虽然像path=\ 那样做，但在部署时它存在于'yourBaseAdress\' +'\'，只需将basename 添加到Router

 <BrowserRouter basename={process.env.PUBLIC_URL}>
     {/* routes */}
 </BrowserRouter>

【讨论】：

BrowserRouter 现在可以使用默认域的 GitHub 页面。但是，它仍然无法使用我的自定义域 (connor-mote.com)。
也许这应该是一个单独的问题。
是的，实际上 BrowserRouter 与 githubPages 有问题，但 HashRouter 和 basename 没有解决您的问题？
不，使用仍然无法与使用我的自定义域的 githubPages 一起使用。
我只需要将 package.json 中的主页更改为我的自定义域。感谢您的帮助！