Mi aplicación de reacción en la página de github no procesa los componentes usando HashRouter, página en blanco en "/" y error 404 en "/ about". esta es mi aplicación.js
function App() { return ( <div className="Container-fluid" id="div2"> <HashRouter basename="/Landing-Page"> <Header /> <Routes> <Route path="/thankyou" element={<ThankYou />} /> <Route exact path="/" element={ <div className="Container"> <SignUp validate={validate} /> <EbookInfo /> </div> } /> <Route path="/about" element={<About />} /> </Routes> </HashRouter> </div> ); } en la página de inicio muestra .../Landing-Page/ como se esperaba, pero en otra página muestra .../about en lugar de .../Landing-Page/about . Tengo la configuración de gh-pages. mi página de github https://alexhmar.github.io/Landing-Page/ mi repositorio https://github.com/alexhmar/Landing-Page/tree/master
También probé esto con <Router basename={process.env.PUBLIC_URL} pero es el mismo problema.
Cuando usa Github Pages y React Router Dom, necesita usar Hash Router .
Reemplace su importación import { HashRouter as Router } from "react-router-dom"; y debería funcionar.
Github Pages no está configurado para aplicaciones de una sola página, si intenta acceder a /bar, intentará encontrar un archivo bar.html y, por lo tanto, le dará un 404. Al usar el enrutador hash, cuando navegue a los enlaces, irá a /#bar para que Github Pages no lo redirija y React Router Dom lo verá navegando a /bar como lo esperaría, siempre que esté usando el componente Link o los ganchos.
Implementé en Heroku en lugar de las páginas de Github, ahora funciona bien.