Docker container doesn't reload Angular app
I found solution for both problems:
inotify -> just edit
package.json
in"scripts"
section this line:"start": "ng serve --host 0.0.0.0 --poll"
, required only for Windows host,hot reload -> add
expose 49153
inDockerfile
and ports- '49153:49153'
indocker-compose.yml
like @kstromeiraos mentioned.
Webpack uses a port to do live reload of the application. That port is 49153
by default.
You have to expose and bind that port in the container to the host port and that should solve your problem.
So, add this to your Dockerfile
.
FROM node:7.1
RUN mkdir -p /usr/src/app
WORKDIR /usr/src/app
COPY package.json /usr/src/app
RUN npm install
RUN npm install -g angular-cli
COPY . /usr/src/app
EXPOSE 4200 49153
CMD [ "npm", "start" ]'
And this to your docker-compose.yml
.
web:
build: .
ports:
- '8089:4200'
- '49153:49153'
volumes:
- .:/usr/src/app/
environment:
- NODE_ENV=dev
command: bash -c "npm start"
My solution using node:slim.
No need for copying data into containers. Just use volumes.
Dockerfile:
NOTE: --poll 1
FROM node:slim RUN npm install @angular/cli@latest -g RUN mkdir -p /home/boilerplate WORKDIR /home/boilerplate EXPOSE 4200 CMD ng serve --port 4200 --host 0.0.0.0 --poll 1
Compose:
project: image: project build: context: . dockerfile: projectdir/Dockerfile volumes: - ./projectdir:/home/boilerplate ports: - 4200:4200