I have a react app that has several pages. When I refresh the page, I can successfully link to one other page. Subsequent links update the url address with the reference to the new page, but only load after the page refreshes.

Error messages in different browsers differ.

In chrome:

[![enter image description here](https://i.stack.imgur.com/pmvdm.png)](https://i.stack.imgur.com/pmvdm.png)

In firefox:

[![enter image description here](https://i.stack.imgur.com/Sj68W.png)](https://i.stack.imgur.com/Sj68W.png)

In safari:

[![enter image description here](https://i.stack.imgur.com/Szbj3.png)](https://i.stack.imgur.com/Szbj3.png)

I have seen [this post](https://stackoverflow.com/questions/27928372/react-router-urls-dont-work-when-refreshing-or-writing-manually) which has very long, complicated suggestions about routing. I'm not sure if this is my problem yet, so have not yet explored the ideas set out as solutions.