Angular 13 / Docker - Live Reloading enabled not working

Viewed 223

I'm currently working on an Angular project and I wanted to dockerize this project. I achieved it, but the problem that I had is that when I save a file it doesn't refresh the browser, IDK if it is the path of the volumes or the config files.

This is my JSON server file Dockerfile.

FROM node:16.14.2
RUN npm install -g json-server

ARG WORK_DIR=/backend
ENV WORK_DIR ${WORK_DIR}

RUN mkdir ${WORK_DIR}
WORKDIR ${WORK_DIR}

COPY db.json ${WORK_DIR}/db.json

EXPOSE 5000

CMD json-server -H 0.0.0.0 --port 5000 --watch ${WORK_DIR}/db.json

This is where my Angular setup is Dockerfile.dev,

FROM node:16.14.2

ARG WORK_DIR=/frontend
ENV PATH ${WORK_DIR}/node_modules/.bin:$PATH

RUN mkdir ${WORK_DIR}
WORKDIR ${WORK_DIR}

COPY package.json ${WORK_DIR}
COPY package-lock.json ${WORK_DIR}

RUN npm install @angular/cli
RUN npm install

COPY . ${WORK_DIR}

EXPOSE 4200

CMD ng serve --host 0.0.0.0

docker-compose.yaml file

version: '3.9' # optional since v1.27.0
services:
  docker-frontend:
    build:
      context: angular-server
      dockerfile: Dockerfile.dev
    ports:
      - '4200:4200'
    volumes:
      - ./angular-server/src:/frontend/src

  docker-backend:
    build:
      context: json-server
      dockerfile: Dockerfile
    ports:
      - '5000:5000'
    volumes:
      - ./json-server:/backend```

It's also important to known that im building this app from this repo enter link description here

enter link description here

0 Answers
Related