当数据在Docker容器内更改时，Create-react-app服务器不会重新编译

Question

我目前正在尝试在docker中运行React应用程序。我正在运行npm start容器内部运行的create-react-app软件包中包含的脚本，并且正在使用绑定安装在主机中工作并反映容器中的更改。遗憾的是，即使文件确实发生了更改，react软件包附带的重新编译功能也无法在容器内部运行。所要抓住的是，我正在使用摘要工具箱。你们知道这可能是什么问题吗？为什么不重新编译？

我的文件结构如下。

project
|   .dockerignore
|   .gitignore
|   docker-compose.yml
|   Dockerfile
|   LICENSE
|   README.md
|
\---frontend
    +---nodemodules\*
    |   package-lock.json
    |   package.json
    |   README.md
    |
    +---public
    |       index.html
    |
    \---src
        |   index.js
        |
        \---container
                App.jsx

Docker文件

FROM node:8.11.1

COPY . /usr/src/

WORKDIR /usr/src/frontend

ENV PATH /usr/src/frontend/node_modules/.bin:$PATH

RUN npm install -g create-react-app
RUN npm install

EXPOSE 3000

CMD [ "npm", "start" ]

docker-compose.yml

version: "3.5"

services:
  react:
    build:
      context: .
      dockerfile: Dockerfile
    volumes:
      - "./frontend:/usr/src/frontend"
      - '/usr/src/frontend/node_modules'
    ports:
      - "3000:3000"
    environment:
      - NODE_ENV=development

Answer 1

有时，当应用程序在容器内运行时，React 不会在更改文件时重新编译代码。

\n\n

如果项目在虚拟机（例如（Vagrant 配置的）VirtualBox）内运行，请.env在项目目录中创建一个文件（如果 \xe2\x80\x99 不存在），然后添加CHOKIDAR_USEPOLLING=true到该文件。这可以确保下次运行时npm start，观察程序根据虚拟机内部的需要使用轮询模式。有关详细信息，请参阅文档。

\n

Answer 2

将你的树更改为

project
|   .dockerignore
|   .gitignore
|   docker-compose.yml
|   LICENSE
|   README.md
|
\---frontend
    +---nodemodules\*
    |   package-lock.json
    |   package.json
    |   README.md
    |   Dockerfile    
    |
    +---public
    |       index.html
    |
    \---src
        |   index.js
        |
        \---container
                App.jsx

Dockerfile

FROM node:node:8.11.1
WORKDIR /usr/src/app
COPY package*.json ./
RUN npm install
COPY . .

EXPOSE 3000
CMD [ "npm", "start" ]

构建镜像，这一步你需要在每个chnage上执行

cd frontend/

docker build -t reactapp .

docker-compose.yml

version: "3.5"
services:
  react:
     image: reactapp
     ports:
       - "3000:3000"