-1

I have deployed my React app to the DigitalOcean App Platform. The app uses client-side routing (e.g., React Router). The home page works correctly when visiting the root URL, but when I try to navigate directly to other routes by entering the URL (e.g., /auth/login), I get a 404 error (The requested page was not found). However, navigating within the app to that URL works as expected.

I have tried configuring catch-all routing using custom pages in the DigitalOcean dashboard, but it doesn't seem to work as intended.

How can I properly configure my React app on the DigitalOcean App Platform to handle client-side routing and serve the index.html file for all routes?

Additional context:

My React app is built using Vite. I am using React Router Dom for client-side routing. My app is deployed on the DigitalOcean App Platform using the default settings.

Kingsley Ijomah
  • 3,273
  • 33
  • 25
  • 1
    You will need to configure the hosting service/server to serve, or redirect to, the root index.html file for all page requests into the app. This isn't something you can fix client-side in the router. Take a look at the CRA [deployment docs](https://create-react-app.dev/docs/deployment/) to get a sense of the kinds of things different server environments require. – Drew Reese May 10 '23 at 23:20

1 Answers1

0

Because this is a static site DO had a build entry but no start script equivalent to run serve etc.

Fix was having a Catchall within custom pages and simply specifying index.html as documented here: https://docs.digitalocean.com/products/app-platform/how-to/manage-static-sites/

Initially, I tried it with /index.html which failed.

Kingsley Ijomah
  • 3,273
  • 33
  • 25