How configure nginx for prerender React App?

Question

I've got React app.

It works well on local machine (app + prerender-spa-plugin). I run it with command http-server into ./build package

However thing go wrong on server - it acts like if I launch it with serve-s command.

There is docker with nginx image on server.

I tried to reconfigure nginx the way that it uses different index.html for different URLs, but fail again

Do the problem with routing to directories that keeps static images?

How it could be resolved? or where I could find information about it?

Answer 1

You have to create virtual host on nginx server and point it to build folder of the app. Don't forget to run npm run build .

Simple nginx config

server {

    listen 80;
    listen [::]:80;

    root /var/www/reactjsapp/build;
    index index.html index.htm;

    server_name reactjsapp.com;

    location / {
        try_files $uri /index.html;
    }

        location ~ /\.ht {
            deny all;
        }

}

Answer 2

I decided it. My config

location / {
            root   /usr/share/nginx/html;
            index  index.html index.htm;
            try_files $uri $uri/ /index.html;
        }

From official documentation:"It is possible to check directory's existence by specifying a slash at the end of a name, eg “$uri/”."

https://i.stack.imgur.com/PusBE.png