Create-react-app server not recompiling when data changes inside docker container

Question

I'm currently trying to run a React application inside docker. I'm running the scripts included in the create-react-app package running npm start inside the container and I'm using bind mounts to work in the host and reflect changes in the container. Sadly, the recompile feature that comes with the react package is not working inside the container even though the files do change. The catch is that I'm using docket toolbox. Do you guys know what could be the problem? Why isn't it recompiling?

My file structure is the following.

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

Dockerfile

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

Sometimes React does not recompile the code upon changing files when app is running inside the container.

If the project runs inside a virtual machine such as (a Vagrant provisioned) VirtualBox, create an .env file in your project directory if it doesn’t exist, and add CHOKIDAR_USEPOLLING=true to it. This ensures that the next time you run npm start, the watcher uses the polling mode, as necessary inside a VM. See documentation for details.