Last reviewed by Netlify Support - November 2024
If you’re building a Single Page Application (SPA), or an app that manages its own routes (url paths), you’ll want to add a _redirects file to your publish directory with the following line to take advantage of browser history pushstate:
/* /index.html 200
You can read more information in our docs, which can be found here.
I have seen people asking on twitter about this. A common question seems to be, “but how do you handle 404s this way?”
For single page applications which require all URLs to be routed to this index.html page so that they can handle the routing in JavaScript, that JavaScript logic is going to need to handle the 404s too. This is because the information about what routes resolve to what views is held in the JS. It needs to handle the behaviour for any missing views itself too.
That’s a great question! the issue is the same with an SPA regardless of where you host it since all requests are passed to the router. If you know all your routes then you can use netlify _redirects to send those specific routes that are used to your index.html, and all others can be handled with a 404 failover rule. Since the _redirects file needs to be there at the end of the build, you can generate a _redirects file based on your routes programmatically during the build process. That said, I don’t know anyone that does this. Google’s crawlers in theory are able to crawl SPA’s, but I don’t know how well that works, and anecdotally speaking , prerendering the page will still give you better results.
Or you can use a static site generator like Gatsby/React-Static or Gridsome/Nuxt (if you already use React or Vue)