React app showing page with "404 the requested path could not be found" when using Apache

Question

I am deploying a React app to my Apache server.

I can access the app on my-ip:5001, but when I go to my domain it gives me "404 the requested path could not be found". Btw. the domain has been set up and worked with an html file before working with react.

I did npm run build and placed the build folder in the root of my server. Made no changes to the package.json file.

I run the server using: serve -s -l 5001

Apache conf file:

<IfModule mod_ssl.c>
<VirtualHost *:443>    
        ServerName somedomain.com
        ServerAlias www.somedomain.com



ProxyRequests On
ProxyVia On
<Proxy *>
  Order deny,allow
  Allow from all
  </Proxy>

        ProxyPass / http://localhost:5001/
        ProxyPassReverse / http://localhost:5001/



</VirtualHost>
</IfModule>

Any idea what might be going on here?

Vixen

Did you ever find a solution to this? – Agraphia

Answer 1

run serve -s from inside of the /build folder. exemple

C:\Users\zafriha\Desktop\myProject>build>cd..

C:\Users\zafriha\Desktop\myProject>npm install -g serve

C:\Users\zafriha\Desktop\myProject>serve -s build

Audet

Answer 2

Had the same issue. Executing nx reset in the terminal solved it.

nx reset

Railroader

Answer 3

You should run the command for production mode like 'npm run start' instead of using 'serve'. (for Dockerfile as well)

Fancywork

npm run start is a shortcut for react-scripts start, which starts a development server; it is not meant to be used on production servers – Physicochemical

you should have 'npm run dev' command for development environment – Fancywork

I'm telling you that for create-react-app the npm run start commands is used for starting the dev server. And create-react-app is (most likely) what people are using unless they specify they are using a more advanced framework. My guess is that you are using nextjs, which has run dev and run start commands and you assumed the OP is using nextjs as well, but there is nothing in the question that may indicate they are using nextjs, so your advice to use run start will not apply to them, since in their project there is no built-in command to serve files. – Physicochemical

yes you are right in my case it was nextjs now i see what you meant thanks – Fancywork

Answer 4

New answer: There is no need to run the serve command on the server. Just put the build folder on the server. Inside the .conf apache file make the DocumentRoot path point to the build folder.

Old answer: Changing these lines:

ProxyPass / http://localhost:5001/
ProxyPassReverse / http://localhost:5001/

to:

ProxyPass / http://my-server-ip:5001/
ProxyPassReverse / http://my-server-ip:5001/

solved the problem

Vixen

Sorry but, can't be seen on 'Search Files' where can we see it? – Isador