当应用程序在Github页面上加载时，Home组件不是呈现，而是在本地主机上加载。

Question

我面临这个奇怪的问题，当应用程序加载时，Home组件不会加载。这个问题出现在Github页面网站上，而不是本地主机上。

在本地主机上，将在应用程序加载时立即加载。

可能是什么原因？

以下是gh页面的网址：

https://umair-mirza.github.io/safetyapp/

下面是App组件的代码：

function App() {
  return (
      <>
      <Router>
        <NavBar />
        <div className="py-4 px-6 flex md:gap-x-4">
        <LeftNav />
          <div className="xs:w-full md:w-4/5">
                  
                  <Routes>
                      <Route path='/' element={<Home />} />
                      <Route path='/audit-inspection' element={<AuditInspection />} />
                      <Route path='/my-responsibilities' element={<MyResponsibilities />} />
                      <Route path='/incident-management' element={<IncidentManagement />} />
                      <Route path='/learning-management' element={<LearningManagement />} />
                      <Route path='/observations-feedback' element={<ObservationsFeedback />} />
                      <Route path='/performance-analytics' element={<PerformanceAnalytics />} />
                      <Route path='/risk-management' element={<RiskManagement />} />
                  </Routes>
          </div>
        </div>
        </Router>
      </>
  );
}

Answer 1

我在gh页面上也有同样的问题，我已经修正了添加basename的方法，就像它提到的这里一样，所以

    <Router>
       <NavBar />
       .
       .

用这个：

    <Router basename="/safetyapp"> //your repo name as basename
       <NavBar />
       .
       .

这将修复导航问题，但是在刷新时，服务器将返回404，因为GitHub页面本机不支持单个页面，我认为这些指令将帮助您