I am trying to make a simple react app in docker-compose. I am using this reference What I have done is run npx create-react-app frontend to generate the default react app. Then I added the Dockerfile. This is all in a directory frontend.
#Dockerfile
FROM node:14.9
# set working directory
WORKDIR /app
# add `/app/node_modules/.bin` to $PATH
ENV PATH /app/node_modules/.bin:$PATH
# install app dependencies
COPY package.json ./
COPY package-lock.json ./
RUN npm install --silent
RUN npm install react-scripts@3.4.1 -g --silent
# add app
COPY . ./
# start app
CMD ["npm", "start"]
In the directory above, I have my docker-compose
#docker-compose.yml
version: '3.7'
services:
frontend:
container_name: frontend
build: ./frontend
volumes:
- './frontend:/app'
- '/app/node_modules'
ports:
- 3000:3000
environment:
- CHOKIDAR_USEPOLLING=true
I run docker-compose up --build and after the normal build process I get this message.
docker-compose up --build
Building frontend
Step 1/9 : FROM node:14.9
---> 1b2c72215052
Step 2/9 : WORKDIR /app
---> Using cache
---> 2bab04404275
Step 3/9 : ENV PATH /app/node_modules/.bin:$PATH
---> Using cache
---> ff4ce5f5ec47
Step 4/9 : COPY package.json ./
---> Using cache
---> b1d25c0b6c05
Step 5/9 : COPY package-lock.json ./
---> Using cache
---> 5b829feaf00d
Step 6/9 : RUN npm install --silent
---> Using cache
---> 835367c47253
Step 7/9 : RUN npm install react-scripts@3.4.1 -g --silent
---> Using cache
---> 015ccb2db237
Step 8/9 : COPY . ./
---> Using cache
---> e4a5285339b5
Step 9/9 : CMD ["npm", "start"]
---> Using cache
---> 3f91b16d34d6
Successfully built 3f91b16d34d6
Successfully tagged projectname_frontend:latest
Recreating frontend ... done
Attaching to frontend
frontend |
frontend | > frontend@0.1.0 start /app
frontend | > react-scripts start
frontend |
frontend | ℹ 「wds」: Project is running at http://172.29.0.2/
frontend | ℹ 「wds」: webpack output is served from
frontend | ℹ 「wds」: Content not from webpack is served from /app/public
frontend | ℹ 「wds」: 404s will fallback to /
frontend | Starting the development server...
frontend |
frontend exited with code 0
It seems the container just exits without an error message. I have no idea what is causing this.
Docker version 19.03.12, build 48a66213fe
It is worth noting that I have been able to build my react apps successfully without the solutions below for the past few months. The need for the commands given in the solution has only recently become an issue for me.