I'm having two React applications running on the same machine. I'm using an nginx reverse proxy to handle routing requests.
The first application is running on root: '/', here is the nginx rule for it:
location / {
proxy_pass http://127.0.0.1:3000;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Host $host;
proxy_cache_bypass $http_upgrade;
proxy_set_header X-Forwarded-Proto https; # for ssl
}
The other app is running on port 4000, using the following reverse proxy:
location /staging/ {
proxy_pass http://127.0.0.1:4000;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Host $host;
proxy_cache_bypass $http_upgrade;
proxy_set_header X-Forwarded-Proto https; # for ssl
}
I followed the [documentation][1] for deployment and I added the following to my package.js:
"homepage": "https:/xyz.com/staging/"
The application works using npm start. However using:
npm run build && serve -s build -l 4000
fails to load. The request to index.html is fine however, every time the app tries to request the static content, it always responds with the index.html contents: [![enter image description here][2]][2]
I tried setting PUBLIC_URL as well, but also failed. Why is react failing to respond with any thing in the static directory? Any help appreciated. [1]: https://create-react-app.dev/docs/deployment/ [2]: https://i.stack.imgur.com/ijqx9.png