docker build was failed due to "COPY failed: no such file or directory" error

Question

I'm setting up travis-ci to build & push docker images when they are committed to github.
But client docker image is not built & pushed to docker hub even though api & nginx images are succeeded.

Sorce code is here:
https://github.com/jpskgc/article

• client: react
• api: golang
• ci: travis-ci

This is .travis.yml

language: generic
sudo: required
services:
  - docker

before_install:
  - docker build -t jpskgc/react-test -f ./client/Dockerfile.dev ./client

script:
  - docker run -e CI=true jpskgc/react-test npm test

after_success:
  - docker build -t jpskgc/multi-client ./client
  - docker build -t jpskgc/multi-nginx ./nginx
  - docker build -t jpskgc/multi-api ./api
  - echo "$DOCKER_PASSWORD" | docker login -u "$DOCKER_ID" --password-stdin
  - docker push jpskgc/multi-client
  - docker push jpskgc/multi-nginx
  - docker push jpskgc/multi-api

this is Dockerfile in client.

FROM node:alpine as builder
WORKDIR '/app'
COPY ./package.json ./
RUN npm install
COPY . .
CMD ["npm", "run", "build"]

FROM nginx
EXPOSE 3000
COPY ./nginx/default.conf /etc/nginx/conf.d/default.conf
COPY --from=builder /app/build /usr/share/nginx/html

I expect client docker image is build & pushed to dockerhub.
But the actual is not created.

4.75s$ docker build -t [secure]/multi-client:latest ./client
553Sending build context to Docker daemon   1.22MB
554Step 1/10 : FROM node:alpine as builder
555 ---> d97a436daee9
556Step 2/10 : WORKDIR '/app'
557 ---> Using cache
558 ---> 9f51c260f236
559Step 3/10 : COPY ./package.json ./
560 ---> Using cache
561 ---> e46d1f93865a
562Step 4/10 : RUN npm install
563 ---> Using cache
564 ---> 4961700b8f5c
565Step 5/10 : COPY . .
566 ---> Using cache
567 ---> 4a5333f50509
568Step 6/10 : CMD npm run build
569 ---> Running in 15030b24cd9a
570 ---> e967a522abbe
571Removing intermediate container 15030b24cd9a
572Step 7/10 : FROM nginx
573latest: Pulling from library/nginx
574f5d23c7fed46: Pulling fs layer
575918b255d86e5: Pulling fs layer
5768c0120a6f561: Pulling fs layer
5778c0120a6f561: Download complete
578918b255d86e5: Verifying Checksum
579918b255d86e5: Download complete
580f5d23c7fed46: Download complete
581f5d23c7fed46: Pull complete
582918b255d86e5: Pull complete
5838c0120a6f561: Pull complete
584Digest: sha256:eb3320e2f9ca409b7c0aa71aea3cf7ce7d018f03a372564dbdb023646958770b
585Status: Downloaded newer image for nginx:latest
586 ---> e445ab08b2be
587Step 8/10 : EXPOSE 3000
588 ---> Running in 84d04cfc54e6
589 ---> 1ed6838be8e8
590Removing intermediate container 84d04cfc54e6
591Step 9/10 : COPY ./nginx/default.conf /etc/nginx/conf.d/default.conf
592 ---> eb7dd4d2b5a6
593Step 10/10 : COPY --from=builder /app/build /usr/share/nginx/html
594COPY failed: stat /var/lib/docker/overlay2/8eab810f807b8244ed20da7b916d08aa7dc2baf99237b8ecba323e39d0a71cea/merged/app/build: no such file or directory
after_success.2
5950.20s$ docker build -t [secure]/multi-nginx ./nginx
after_success.3
60367.74s$ docker build -t [secure]/multi-api ./api
after_success.4
6800.61s$ echo "$DOCKER_PASSWORD" | docker login -u "$DOCKER_ID" --password-stdin
after_success.5
6820.04s$ docker push [secure]/multi-client:latest
683The push refers to a repository [docker.io/[secure]/multi-client]
684An image does not exist locally with the tag: [secure]/multi-client
after_success.6
6853.94s$ docker push [secure]/multi-nginx
after_success.7
69626.63s$ docker push [secure]/multi-api
742
743Done. Your build exited with 0.

Answer 1

You create the build using npm run build. You put this into CMD which means it will run when you start a container from this image, but not at build time.

If you want to create the application build at image build time you need to run npm run build using RUN just as you do with npm install.

This version should work:

FROM node:alpine as builder
WORKDIR '/app'
COPY ./package.json ./
RUN npm install
COPY . .
RUN npm run build

FROM nginx
EXPOSE 3000
COPY ./nginx/default.conf /etc/nginx/conf.d/default.conf
COPY --from=builder /app/build /usr/share/nginx/html

If this doesn't work then please check what npm run build actually does in your application.