Definitivamente carga en Blanco totalmente , parece que no puede leer el bundle.js <a href="url">https://camilogonzalezf.github.io/react...

Ninguno de los dos links sirve :c

Hola! Pudiste solucionarlo? Tengo el mismo problema que tú. Hasta ahora lo que descubrí es que si al archivo index.htlml de la rama gh-pages le agrego un "./" en el src del script bundle.js la pagina carga. Sin embargo tiene problemas leyendo todo lo demás (imágenes, paginas, etc.). . Supongo que es un problema de los paths, pero no se me ocurre como solucionarlo dentro de bundle.js.

Jeffuy, yo segui un tutorial del buen Tanx:

https://platzi.com/tutoriales/2484-react-practico/12068-desplegar-una-app-de-react-junto-con-otros-projectos-en-github-pages/

al final talvez no te lee los recursos porque va directamente a https://tunombredegit.github.io y no a https://tunombredegit.github.io/tuproyecto, revisa si puedes los sources que cargan al inspeccionar tu pagina a ver si tienes las direcciones de los recursos bien

Raimon-koudsi, al final conseguí hacer el deploy. El problema estaba en como había creado los outputs (me faltaba una "/"). !url1 Sin embargo por lo que leí github Pages no permite una buena navegación cuando se suben proyectos de React. Da error 404 al intentar hacer click en algún link o acceder a una página que no sea la principal. !url1 Sinceramente, luego que conseguí hacer el deploy deje de buscar mucho más. Leí por ahí que se puede lograr haciendo navegación por hash (usando los id en lugar de las url), pero no seguí probando así que quizás haya otras maneras. !url1 Tu puedes entrar a las rutas internas del proyecto? (por ejemplo "tuproyecto/login"?)

Hola, tenía el mismo problema que tú, lo que hice fue modificar el webpack:

output: {
        path: path.resolve(__dirname, 'dist'),
        filename: 'bundle.js',
        publicPath:'./'  /*Agregué un punto para que GitPages encuentre la ruta del bundle
    },

Luego de eso, tuve problemas con el react-router, el cual no encontraba las rutas y me seguía mostrando la página en blanco, así que utilizando react-router versión 6.0.2 modifique App.js

<AppContext.Provider value={initialState}>
			<BrowserRouter>
				<Layout>
					<Routes>
						<Route path="/" element={<Home />} > /*El home debe contener a las demas rutas*/
							<Route path="/login" element={<Login />} />
							<Route path="/password-recovery" element={<PasswordRecovery />} />
							<Route path="/send-email" element={<SendEmail />} />
							<Route path="/new-password" element={<NewPassword />} />
							<Route path="/account" element={<MyAccount />} />
							<Route path="/signup" element={<CreateAccount />} />
							<Route path="/checkout" element={<Checkout />} />
							<Route path="/orders" element={<Orders />} />
							<Route path="*" element={<NotFound />} />
						</Route>
					</Routes>
				</Layout>
			</BrowserRouter>
		</AppContext.Provider>

En este punto ya empezó a mostrar mi sitio en GitHub Pages

Cuando se modifica el webpack para que GitHub Pages muestre el sitio, deja de funcionar en el servidor local, configurando un archivo webpack para producción y otro para desarrollo se soluciona, como lo explican en el curso de webpack.

Así me funcionó a mí, espero les sirva.

Gracias Sebastián, pero sigo teniendo el mismo problema. El punto ya lo había colocado y con eso logré que se muestre la página principal. Sin embargo no puedo acceder a "login", "password-recovery" y las demás secciones.

Ecommerce-React

Yo tuve el mismo error, pero se soluciono con el aporte de sebastianpizarro, pero en mi caso en la fecha actual usando react-router 6.2.1 cambia un poco, pero me apoye en la documentación en el apartado Nested Routes. De igual forma previamente tome el curso de Webpack del cual me apoye mucho para la configuración de producción.

Respondiendo a mi comentario anterior, no había notado que solo se muestra la pagina principal y los Nested Links solo renderiza las rutas en la vista padre donde insertes el Outlet. Después de investigar mi solución fue la siguiente: Remplazar el BrowserRouter por HashRouter (incluido en react-router).

import { Routes, Route, HashRouter} from 'react-router-dom'

Luego con cambiar la etiqueta de browser por hash es suficiente (Nota que descarte las rutas anidadas dejando cada una como independiente.

const App = () => {
    const initialState = useInitialState();
    
    return (
        <AppContext.Provider value={initialState}>
            <HashRouter>
                <Layout>
                    <Routes>
                        <Route path="/" element={<Home />} />
                        <Route path="/login" element={<Login />} />
                        <Route path="password-recovery" element={<PasswordRecovery />} />
                        <Route path="/send-email" element={<SendEmail />} />
                        <Route path="/new-password" element={<NewPassword />} />
                        <Route path="/account" element={<MyAccount />} />
                        <Route path="/signup" element={<CreateAccount />} />
                        <Route path="/checkout" element={<Checkout />} />
                        <Route path="/orders" element={<Orders />} />
                        <Route path="*" element={<NotFound />} />
                    </Routes>
                </Layout>
            </HashRouter>
        </AppContext.Provider>
    );
}

Como resultado resolvera las rutas con hashes por ejemplo: react-shop-example/#/login

Logrando así navegar con la barra de direcciones en nuestra aplicación.