Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

GitHub Pages shows 404 error when navigating via BrowserRouter #40

Open
qnxdev opened this issue Jun 18, 2020 · 3 comments
Open

GitHub Pages shows 404 error when navigating via BrowserRouter #40

qnxdev opened this issue Jun 18, 2020 · 3 comments
Assignees
Labels
react-router App uses React Router

Comments

@qnxdev
Copy link

qnxdev commented Jun 18, 2020

I have been using react app with gh pages using HashRouter.
Now I updated to Browserrouter.

Now the inital load everything is fine but reloading in and internal link returns Page not found
Some innner pages alse return page not found

suppose

site.com/about/me will show if I go there from site.com/
but on reload t shows page not found

check https://qnxdev.github.io/vjcbuild/

@catherineisonline
Copy link

Having the same issue for a while, found any solution yet? :))

@israelmrios
Copy link

I had a similar issue, and found it was the way I was Handling my Routing. I was using <BrowserRouter> on my root index.js file but GitHub Pages does not support browser history like your browser does. I switched my routing to <HashRouter> this type of router uses the hash portion of the URL to keep the UI in sync with the URL.

ReactDOM.render( <React.StrictMode> <HashRouter> <App /> </HashRouter> </React.StrictMode>, document.getElementById('root') );

@gitname
Copy link
Owner

gitname commented Aug 6, 2022

Hi @qnxdev, sorry about the long wait.

In case you are still facing this issue, you may want to employ one of the two workarounds I listed in #104 (comment). One is to, as @israelmrios mentioned, switch back to <HashRouter>. The other involves continuing to use <BrowserRouter>, but only after employing the "trick" described here: https://github.com/rafgraph/spa-github-pages.

You can learn more about the situation by reading the "Notes on client-side routing" section of the Create React Apps documentation: https://create-react-app.dev/docs/deployment/#notes-on-client-side-routing

@gitname gitname added the react-router App uses React Router label Aug 6, 2022
@gitname gitname self-assigned this Aug 6, 2022
@gitname gitname changed the title Browser router gives Page not found GitHub Pages shows 404 page when navigating via BrowserRouter Aug 6, 2022
@gitname gitname changed the title GitHub Pages shows 404 page when navigating via BrowserRouter GitHub Pages shows 404 error when navigating via BrowserRouter Aug 6, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
react-router App uses React Router
Projects
None yet
Development

No branches or pull requests

4 participants