在能够加载着陆页（Home组件）之后，如何通过github页面获取其余的react组件？

Question

我花了几个小时试图让我的创建反应应用程序通过git-hub页面进行部署。我能够渲染着陆页/ home组件，但是由于路径更改后我的其他组件将无法渲染。我有正确的prod构建反应，我正在使用HashRouter。由于我的主页加载而不是其他导航/组件，我认为这是一个简单的路由问题，但在阅读完所有文档之后，我仍然无法解决问题。这是杀了我哈哈。这是主页的链接。请注意，如果单击导航链接，则会出错。 http://zonekid.github.io/TelevisionFavorites

对于App.js

    `class App extends Component {
  render() {
    return (
    <React.Fragment>
<Container fluid>
    <Router basename="/">
    <Switch>
    <Route exact path="/" component={Home}/>
    <Route path="/twin-peaks" component={TwinPeaks}/>
    <Route path="/atlanta" component={Atlanta}/>

导航组件（HomeNav.js）

    <Nav className="justify-content-center" activeKey="/home">

        <Nav.Item>
            <Color1>
          <Nav.Link className="nav-link" href="/atlanta" eventKey="link-1">Atlanta</Nav.Link>
          </Color1>
        </Nav.Item>
        <Nav.Item>
            <Color2>
          <Nav.Link href="/twin-peaks" eventKey="link-2">Twin Peaks</Nav.Link>
          </Color2>
        </Nav.Item>

`

Answer 1

如果您的应用程序是使用create-react-app制作的，那么您应该将basename设置为process.env.PUBLIC_URL，而不是像/那样的当前值：

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