Docker for Windows で webpack dev server のオートリロード（ファイル監視）が動作しない場合の解決策

結論

うまく動かなかったら watchOptions.poll を試してね、とのこと。

If watching does not work for you, try out this option. Watching does not work with NFS and machines in VirtualBox.

webpack 公式ドキュメント より。

設定例

http://localhost:8080 で動作する最小限の記述になります。

本件以外では webpack.config.js の host 、docker-compose.yml の working_dir と ports あたりがハマりポイントになるかと思います。

webpack.config.js

const path = require('path');

module.exports = {
    mode: 'development',
    entry: path.join(__dirname, 'src', 'index.js'),
    output: {
        path: path.join(__dirname, 'dist'),
        filename: 'bundle.js',
    },
    devServer: {
        contentBase: path.join(__dirname, 'dist'),
        host: '0.0.0.0',
        port: 8080, // default
    },
    watchOptions: {
        poll: 1000
    }
};

docker-compose.yml

version: '3'
services:
  app:
    image: node:12
    working_dir: /app
    volumes:
      - .:/app
    ports:
      - 8080:8080 # port は devServer と揃える必要がある
    command: npm start

package.json

{
  "name": "app",
  "version": "1.0.0",
  "private": true,
  "scripts": {
    "build": "webpack",
    "start": "webpack-dev-server"
  },
  "devDependencies": {
    "webpack": "^4.44.1",
    "webpack-cli": "^3.3.12",
    "webpack-dev-server": "^3.11.0"
  }
}

以上です。