Docker build throws "react-scripts: not found" error

Question

I am using create-react-app and want to publish my project with Docker. with docker build . -t react-docker command and I'm getting this error:

/bin/sh: 1: react-scripts: not found error Command failed with exit code 127.

I deleted package-lock.json and run npm install again, but my problem was not solved!

Dockerfile:

# stage: 1 
FROM node:8 as react-build 
WORKDIR /app 
COPY . ./ 
RUN yarn 
RUN yarn build 
# stage: 2 — the production environment 
FROM nginx:alpine 
COPY — from=react-build /app/build /usr/share/nginx/html 
EXPOSE 80 
CMD [“nginx”, “-g”, “daemon off;”]

Answer 1

Are you working with volumes? With a normal installation, docker should have access to your resource. But I have seen on my coworker's machine there were some weird permission problems. So docker couldn't write when trying to yarn install. So no node_modules were created (just as you described in the discussion). Thus no react-scripts.

Solution: Grant others access to the location where you want to mount. Or don't use volumes.

Answer 2

If you don't need to make it a two step process, you could do everything within one Dockerfile and then remove the dependencies needed for the installation afterwards.

I wrote a tutorial on the setup a little while back. Although it's directly with an alpine base.

Deploying ReactJS With Docker

---

The Dockerfile I wrote was:

NOTE: you could replace npm with yarn

File: Dockerfile

FROM alpine

EXPOSE 80

ADD config/default.conf /etc/nginx/conf.d/default.conf

COPY . /var/www/localhost/htdocs

RUN apk add nginx && \
    mkdir /run/nginx && \
    apk add nodejs && \
    apk add npm && \
    cd /var/www/localhost/htdocs && \
    npm install && \
    npm run build && \
    apk del nodejs && \
    apk del npm && \
    mv /var/www/localhost/htdocs/build /var/www/localhost && \
    cd /var/www/localhost/htdocs && \
    rm -rf * && \
    mv /var/www/localhost/build /var/www/localhost/htdocs;

CMD ["/bin/sh", "-c", "exec nginx -g 'daemon off;';"]

WORKDIR /var/www/localhost/htdocs

File used for nginx configuration

File: default.conf

server {
        listen 80 default_server;
        listen [::]:80 default_server;
        location / {
                root   /var/www/localhost/htdocs/build;
                # this will make so all routes will lead to      
                # index.html so that react handles the routes              
                try_files $uri $uri/ /index.html;
        }
        # You may need this to prevent return 404 recursion.
        location = /404.html {
                internal;
        }
}

Hope this helps as a possible alternative.