Docker 创建反应应用程序热重载不起作用

Posted 2023-02-19

【中文标题】Docker 创建反应应用程序热重载不起作用

【英文标题】：Docker Create react app hot reload not working

【发布时间】：2020-02-18 20:52:25

【问题描述】：

我正在尝试使用 Create React App 和 Node js 在 Docker 中设置开发环境。 但是当我更改代码时，它不会重新加载更改

通常只使用卷就足够了，但我还添加了： CHOKIDAR_USEPOLLING=真 在 ENV 中，正如 create react app 官方文档所说，我将代码移至 WSL，因为我在 Windows 10 上，但仍然相同。 我使用 create react app 创建了另一个项目，并使用了带有 CHOKIDAR_USEPOLLING=true 的 docker 并且工作正常，但是当我添加更多服务时将不再工作。

这是我的 docker-compose 文件。

version: '3.3'
services:
  backend:
    image: node
    build:
      context: ./salesbackend/
    ports: 
      - 5000:3001
    env_file: ./salesbackend/.env
    volumes:
      - ./salesbackend:/var/app/salesbackend
      - /var/app/salesbackend/node_modules
    depends_on: 
      - mongo
  frontstore:
    build:
      context: ./frontstore/
    ports:
      - 5001:3000
      - 5002:3003
    env_file: ./frontstore/.env
    environment:
      - NODE_ENV=development
      - CHOKIDAR_USEPOLLING=true
    volumes: 
      - ./frontstore:/var/app/frontstore
      - /var/app/frontstore/node_modules
    depends_on: 
      - backend
  frontend:
    build:
      context: ./frontend/
    ports:
      - 5003:4000
    env_file: ./frontend/.env
    environment:
      - NODE_ENV=development
      - CHOKIDAR_USEPOLLING=true
    volumes: 
      - ./frontend:/var/app/frontend
      - /var/app/frontend/node_modules

  mongo:
    image: mongo
    volumes: 
      - ./db/:/data/db
    ports:
      - 30000:27017

这是我用于前端服务的 Dockerfile，

-> Frontend 和 Frontstore 都是在 create react app 中创建的，并且都无法正常工作。

FROM node:10
WORKDIR /var/app/
COPY package.json /var/app/package.json
RUN npm install

COPY . .

CMD ["npm","start"]

使用 docker-compose up 效果很好，当我编辑在 NestJS 中构建的后端时，会更改自动重新加载，但对于 create-react-app 则不行。

【参考方案1】：

已修复

这个问题是 在文件 Dockerfile 中 工作目录是/var/app/ 在我的 docker-compose.yml 中，我将当前工作目录挂载到 /var/app/frontend，我只是删除了那个 /frontend 并且工作正常。