404 error when i refresh/reload page everysingle page other than landing page. React app with react-router-dom


I built a React app using react-router-dom.

website: https://notinstadevelopment.netlify.app/
github: GitHub - daman-m/notInsta at development

The issue is whenever i reload or refresh a page other than the landing page (the link above), i get an error message saying page not found. The site works locally and is reloads just fine locally. Everything works perfectly locally, no errors in console, routing properly and all. I’ve tried adding a redirects file and the issue still persists.

Error Message :

Page Not Found

Looks like you’ve followed a broken link or entered a URL that doesn’t exist on this site.

Back to our site

If this is your site, and you weren’t expecting a 404 for this path, please visit Netlify’s “page not found” support guide for troubleshooting tips.

@daman-m When you say “I’ve tried adding a redirects file and the issue still persists”… what did you put in the redirects file?

This is almost certainly the issue you’re experiencing:

I explained “why it works” as an answer to another user here:

1 Like

@nathanmartin I appreciate the speedy reply, the following is the line in my redirects file:

/*    /index.html   200

@daman-m I presume that build is the folder that you have set as your Publish directory for Netlify?

Out of curiosity, have you performed your build locally and confirmed that the _redirects file remains?

@nathanmartin So when i performed the build locally, the _redirects file got deleted

@daman-m Excellent, as I’d suspected that’s why your _redirects aren’t working.
The file must be in the output that Netlify deploys.

It differs depending on the system you’re working with, but in your case I’d imagine you want to put the file into your public folder, so that it is copied into the build folder when the build is executed.

1 Like

@nathanmartin It works! Thank you so much Nathan! I’ve been trying to figure this out for the past 6 hours. Really appreciate your guidance :pray:

I understand you’re experiencing an issue, but nobody is going to add screenshots to an issue that was basic “user error” and resolved 7 months ago.

Your own issue may be the same, or it may be different.

This was also never a “code issue”, so there is no code required to be demonstrated to fix it.

It’s all exactly as this conversation (and the documentation) explain, which is that the _redirects file must end up in the Publish directory.

Netlify will only read the file from that location, if it’s anywhere else then it will not be read and your redirects will not be applied.

The issue here was that the user was putting the file directly into their Publish directory, which was being automatically destroyed and recreated on every build, meaning the file didn’t actually exist in the output.

So to debug your own project, run your build locally, then ensure your _redirects file is in the folder you have specified as your Publish directory. If it isn’t, determine why it isn’t and fix it.