當我使用 github 個頁面托管我的 React 應用程序時，React Router dom 不工作？

Question

導入'./App.css'；

從 './component/NavBar.component' 導入 NavBar；

從 './component/main.component' 導入 Main；

從 './component/footer.component' 導入頁腳；

import { Routes, Route, Link } from "react-router-dom";

從'./component/NavbarComponent/about.component'導入關於；

從 './component/NavbarComponent/hire.component' 導入 Hire；

從'./component/NavbarComponent/suport.component'導入支持；

function App() { 返回 (

  <Routes>
    <Route exact path="/" element={<Main />}/>

    <Route exact path="/about" element={<About />} />

    <Route exact path="/hire" element={<Hire/>} />

    <Route exact path="/support" element={<Support />} />

    <Route path="*" element={<h1>Page not Found</h1>} />

  </Routes>
  <Footer/>
</div>

); }

導出默認應用程序；

/* 網站鏈接

https://iamniteshpandit.github.io/Chalo-deploy-karte-hain/

存儲庫鏈接：-

https://github.com/IAMNITESHPANDIT/Chalo-deploy-karte-hain

你也可以做拉取請求的任何建議，如果那會改進我的代碼，那么我肯定會接受:)

*/

Answer 1

導入'./App.css'；

從 './component/NavBar.component' 導入 NavBar；

從 './component/main.component' 導入 Main；

從 './component/footer.component' 導入頁腳；

從“react-router-dom”導入{路由，路由}；

從'./component/NavbarComponent/about.component'導入關於；

從 './component/NavbarComponent/hire.component' 導入 Hire；

從'./component/NavbarComponent/suport.component'導入支持；

function App() { 返回 (

  <Routes>
    /**here path changed path='/' into path="/Chalo-deploy-karte-hain" in-order to application would able to work with github pages  */
   

<Route exact path="/Chalo-deploy-karte-hain" element={}/>

    <Route exact path="/about" element={<About />} />

    <Route exact path="/hire" element={<Hire/>} />

    <Route exact path="/support" element={<Support />} />

    <Route path="*" element={<h1>Page not Found</h1>} />

  </Routes>

  <Footer/>

</div>

); }

導出默認應用程序；