如何使用React路由器将CRA部署到GitHub页面

Question

我被这个曲线球困住了。

我有一个基于创建反应应用的网站，我想将其部署到GitHub页面，但是，我已经使用 React Router点击了阻止程序。

我理解GitHub页面可以完美地使用静态内容，但是：

1-使用react路由器部署到带有SPA的GitHub页面的正确解决方案是什么？

我尝试了各种配置，但都没有。

我的路线配置为：

Index.js

import React from 'react';
import { render } from 'react-dom';
import { BrowserRouter as Router } from "react-router-dom";
import App from './App';
render(<Router basename={process.env.PUBLIC_URL}><App /></Router>, 
 document.getElementById('root'));

Routes.js

import { Route, Switch, Redirect, HashRouter } from 'react-router-dom';
...

const Routes = () => (
    <Switch>
        <Route path='/' exact component={Home} />
        <Route path='/contact' exact component={Contact} />
        <Route path='/about/faculty' exact component={Faculty} />
        <Route path='/about/what-we-do' exact component={Mission} />
        <Redirect from='/about/' to='/about/faculty' />
        <Route component={NotFound} />
    </Switch>
)
export default Routes;

我尝试用<Switch/>包裹<HashRouter/>，但这使路线不再有效。

我的Package.json

{
  "name": "my-site",
  "version": "0.1.0",
  "private": true,
  "homepage": "https://username.github.io/project_name",
  "dependencies": {
    ...

    "react-router": "4.2.0",
    "react-router-bootstrap": "0.24.4",
    "react-router-dom": "4.2.2",
    "react-scripts": "1.1.0"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test --env=jsdom",
    "eject": "react-scripts eject",
    "predeploy": "npm run build",
    "deploy": "gh-pages -d build"
  },
  "devDependencies": {
    "gh-pages": "^1.1.0"
  }
}

发布yarn build和yarn run deploy后，该网站会发布到此页面，该页面根本不包含任何内容，当然我试用的任何路线都会给我 404。

2-关于package.json主页的正确配置是什么？：

"homepage": "https://username.github.io/project_name" 要么 "homepage": "https://username.github.io"

最后，我希望在https://username.github.io网址下投放该网站，因此我对正确的配置感到困惑。

3 - 我阅读了文档，声明我应该部署在我的GitHub上实际没有显示的gh pages branch下。我只能选择发布到掌握。