React + Docker + Nginx

Question

I have some problem with create-react-app and docker configuration with nginx, this is my first time when i trying to dockerize react app. I tried many different settings and almost always i get 404 after build.

This is my docker file:

FROM node:alpine as build
WORKDIR /app
COPY package*.json /app/
RUN yarn install
COPY . .
RUN yarn run build

FROM nginx:alpine
COPY --from=build /app/build /usr/share/nginx.html
RUN rm /etc/nginx/conf.d/default.conf
COPY nginx/nginx.conf /etc/nginx/conf.d
EXPOSE 80
CMD ["nginx", "-g", "daemon off;"]

Right now my nginx file looks like that, but as i said, i tried many different settings

server {
    listen  80;
    location / {
        root   /var/www;
        index  index.html index.htm;
        try_files $uri $uri/ /index.html =404;
    }
}

And this is what i see after build

I dont know if this is important but for routing i using react-navi. Any ideas?

Answer 1

It looks like your Nginx configuration is looking at /var/www but you're copying your files to /usr/share/nginx.html. Shouldn't the copy command look like this?

COPY --from=build /app/build /var/www