Listen to changes and reload container on code change - docker-compose

Question

I am using docker-compose in visual studio 2019 with docker for windows running linux containers. I want to enable hot reload for the angular client app.

I modified the npm command running the app to include poll like:

"docker-start": "ng serve --host 0.0.0.0 --port 4200 --proxy-config proxy-conf.json --poll 1"

and added a volume into docker-compose like so:

volumes:
  - ./ClientApp:/app/

also additionally exposing the webpack port

ports:
  - 4200:4200
  - 49153:49153

docker-compose file is at the root of the repo and the angular app is in the /ClientApp folder. This makes the application throw cannot GET\ every time I navigate to localhost:4200. If I comment out the volume mapping, the application starts working but the reload does not. I would like it to listen to changes in the code and update the container as needed every time I change any frontend code.

Entire dockerfile:

FROM node:9.6.1

RUN mkdir -p /app
WORKDIR /app
EXPOSE 4200
EXPOSE 49153

ENV PATH /app/node_modules/.bin:$PATH

COPY . /app

RUN npm install --silent
RUN npm rebuild node-sass

CMD ["npm", "run", "docker-start"]

Answer 1

Use nodemon to automatically restart the node server when code is changed . Before that install nodemon in your docker image and make sure it is present.

Refer this URL to install nodemon :https://www.npmjs.com/package/nodemon

then change your CMD in Dockerfile

CMD ["nodemon", "--exec", "npm", "run", "docker-start"]

This is reload your nodejs application whenever codes are changed