Docker compose not properly copying files to run react app

Question

I am trying to run a create-react-app inside of a docker container and automate docker build/run with docker-compose to eventually add other containers like a backend + db. Running docker-compose in the local folder works properly but setting the context to the folder and running it in the parent directory results in an error.

I have tried to get the container to list the current files so I can see if package.json is properly being copied over but ls and bash aren't in path of the node image or container so they won't run properly.

docker-compose.yaml

version: '3.5'

services:

  dashboard-serve:
    container_name: dashboard
    build:
      context: ./React-Frontend
      dockerfile: Dockerfile
    volumes:
      - '.:/app'
      - '/app/node_modules'
    ports:
      - '3001:3000'
    environment:
      - NODE_ENV=development

dockerfile

FROM node:12.2.0-alpine

# set working directory
WORKDIR /app

# add `/app/node_modules/.bin` to $PATH
ENV PATH /app/node_modules/.bin:$PATH

# install and cache app dependencies
COPY package.json /app/package.json
RUN npm install 
RUN npm install react-scripts@3.0.1 -g 

# start app
CMD ["npm", "start"]

It runs and outputs an error that it cannot find package.json

dashboard          | npm ERR! path /app/package.json
dashboard          | npm ERR! code ENOENT
dashboard          | npm ERR! errno -2
dashboard          | npm ERR! syscall open
dashboard          | npm ERR! enoent ENOENT: no such file or directory, open '/app/package.json'
dashboard          | npm ERR! enoent This is related to npm not being able to find a file.
dashboard          | npm ERR! enoent 
dashboard          | 
dashboard          | npm ERR! A complete log of this run can be found in:
dashboard          | npm ERR!     /root/.npm/_logs/2019-07-30T15_55_23_780Z-debug.log
dashboard exited with code 254

Your `volumes:` directive is overwriting everything in the container build sequence, and also is preventing any future updates to your `package.json` file from having an effect. Can you remove them (and do live development outside of Docker)? — David Maze, Jul 30 '19 at 17:36

mcranston18 · Answer 1 · 2019-07-30T16:13:15.110

1

You must copy your files into the Docker container. Currently , you're only copying the package.json file.

FROM node:12.2.0-alpine

# set working directory
WORKDIR /app

# add `/app/node_modules/.bin` to $PATH
ENV PATH /app/node_modules/.bin:$PATH

# install and cache app dependencies
COPY ./React-Frontend/package.json /app/package.json
RUN npm install 
RUN npm install react-scripts@3.0.1 -g 

# Copy files into Docker container
COPY ./React-Frontend /app

# start app
CMD ["npm", "start"]

edited Jul 30 '19 at 16:13

answered Jul 30 '19 at 16:02

mcranston18

4,680
3
36
37

After adding that line I'm still getting the same error, Is there any way to view the containers file system given that it won't startup and bash/ls/normal linux commands aren't working on it? – user3645925 Jul 30 '19 at 16:08
Have you re-built your containers? e.g. `docker-compose build` – mcranston18 Jul 30 '19 at 16:11
After copying everything out of the docker container it looks like everything from the parent directory has been copied into app. the dockerfile doesn't seem to be following the context of ./React-Frontend internally? – user3645925 Jul 30 '19 at 16:11
Yes I rebuilt using docker-compose up --build – user3645925 Jul 30 '19 at 16:12
Oh, if you don't want to copy the parent directory, then you'll need to `COPY` the `./React-Frontend` folder into the container. I've updated the Dockerfile – mcranston18 Jul 30 '19 at 16:13
Is there anyway to make the dockerfile respect the context its running in so that the dockerfile will work both with docker-compose in parent directory and just as a one off in the child directory? – user3645925 Jul 30 '19 at 16:16
You can remove the `context` from the docker-compose file since it's already specified in the Dockerfile – mcranston18 Jul 30 '19 at 16:18
Still didn't work, couldn't find the package.json at ./React-Frontend/package.json even though it exists for sure. Tried resetting the file back to basics except changing npm start to "/bin/ls", "/app" and /app, without copying any files in explicitly, is containing all of the files of the parent directory where I'm calling docker-compose even though I am not telling it to do this. It also refuses to let me not specify a context for the build. – user3645925 Jul 30 '19 at 16:23

Docker compose not properly copying files to run react app

1 Answers1