Docker卷已挂载但代码变更未在应用中生效问题排查

我有两个容器：前端（Next.js）和后端（NestJS），通过docker-compose运行。项目结构如下：

project/
├─ frontend/
│  ├─ Dockerfile
├─ backend/
│  ├─ Dockerfile
├─ docker-compose.yml

后端Dockerfile #

FROM node: alpine
WORKDIR /app
COPY package.json .
COPY yarn.lock .
RUN yarn config set "strict-ssl" false
RUN yarn install --verbose
COPY . .
RUN yarn build
EXPOSE 4000
CMD ["yarn","start:dev"]

前端Dockerfile #

FROM node: alpine
WORKDIR /app
COPY package.json .
COPY yarn.lock .
RUN yarn config set "strict-ssl" false
RUN yarn install --verbose
COPY . .
RUN yarn build
EXPOSE 3000
CMD ["yarn", "dev"]

docker-compose.yml #

version: '3'
services:
  backend:
    build:
      context: ./packages/backend
    volumes:
      - /app/node_modules
      - ./packages/backend:/app
    ports:
      - '4000:4000'
    restart: always
  frontend:
    build:
      context: ./packages/frontend
    volumes:
      - /app/node_modules
      - ./packages/frontend:/app
    ports:
      - '3000:3000'
    depends_on:
      - backend
    restart: always

遇到的问题 #

在Windows 10的WSL 2环境下运行Docker，执行docker-compose up后修改代码，变更会同步到容器内（已通过docker exec命令确认），但应用中未体现。例如在前端index.js添加按钮，浏览器刷新后按钮未显示。

问题解决 #

Docker配置本身无误，但Next.js和NestJS在Docker容器内默认不支持热重载。针对Next.js配置了webpack web中间件，针对NestJS使用了nodemon，实现代码变更后的热重载。

内容的提问来源于stack exchange，提问作者Mark