ホットリロードが効かない（docker-compoise,laravel,react,nginx,mysql)

Question

前提・実現したいこと

表題の技術を使って環境構築を行っています。
それぞれのコンテナを起動させ、画面を表示させるところまでができました。
React側のソースを編集した際、その編集が即時反映されるようにしたいのですが、うまくいきません。
コンテナ、Reactのどれの設定がよくないのかもわかっていません。※bladeへの変更は反映されます
下記の参考記事は試しましたが解決できませんでした。

該当のソースコード

docker-compose.yml

version: "3.9"
services:
  app:
    build: ./infra/php
    volumes:
      - ./backend:/work
    depends_on:
      - db

  web:
    image: nginx:1.20-alpine
    ports:
      - 8080:80
    volumes:
      - ./backend:/work
      - ./infra/nginx/default.conf:/etc/nginx/conf.d/default.conf
    working_dir: /work

  db:
    build: ./infra/mysql
    container_name: db
    volumes:
      - db-store:/var/lib/mysql
    command: mysqld --character-set-server=utf8mb4 --collation-server=utf8mb4_unicode_ci
    ports:
    - 3306:3306

volumes:
  db-store:

infra/php/Dockerfile

FROM php:8.0-fpm-buster
SHELL ["/bin/bash", "-oeux", "pipefail", "-c"]

ENV COMPOSER_ALLOW_SUPERUSER=1 \
  COMPOSER_HOME=/composer

COPY --from=composer:2.0 /usr/bin/composer /usr/bin/composer

RUN apt-get update && \
  apt-get -y install git unzip libzip-dev libicu-dev libonig-dev && \
  apt-get clean && \
  rm -rf /var/lib/apt/lists/* && \
  docker-php-ext-install intl pdo_mysql zip bcmath

# nodejs install
RUN curl -sL https://deb.nodesource.com/setup_12.x | bash -
RUN apt-get install -y nodejs
RUN npm install npm@latest -g



COPY ./php.ini /usr/local/etc/php/php.ini

WORKDIR /work

webpack.mix.js

const mix = require('laravel-mix');

/*
 |--------------------------------------------------------------------------
 | Mix Asset Management
 |--------------------------------------------------------------------------
 |
 | Mix provides a clean, fluent API for defining some Webpack build steps
 | for your Laravel application. By default, we are compiling the Sass
 | file for the application as well as bundling up all the JS files.
 |
 */

 mix.browserSync({
    files: [
        "resources/views/app.blade.php",
        // "public/**/*.*"
    ],
    proxy: {
        target: "http://127.0.0.1:8080",
    }
});

mix.js('resources/js/app.js', 'public/js')
    .react()
    .sass('resources/sass/app.scss', 'public/css');

参考記事

https://panda-program.com/posts/laravel-hot-reload-with-blade

Answer 1

docker-compose.ymlに下記のコードを追加するといいかもしれません

environment:
- CHOKIDAR_USEPOLLING=true

それでも解決しない場合は下のUrlが参考になると思います。
https://create-react-app.dev/docs/troubleshooting/#npm-start-doesnt-detect-changes