Browsersync无法使用Docker和Webpack打开浏览器

Question

问题

当我运行npm run start来通过webpack进行服务和观察时，我在脚本完成执行后收到了下面的警告。我正在启动并运行浏览器，它会完美地加载页面并显示已连接到Browsersync的通知。但是当我对任何文件（html，css或js）进行任何更改时。它没有重装！？

是因为我在Docker虚拟环境中，还是因为我没有正确地指示Browsersync寻找我的代码所在的正确路径，或者与BrowserSyncPlugin中的代理设置有关的东西，或者是什么其他..？我不知道造成这种情况的原因，我应该继续尝试修复它还是一个已知的问题！谢谢，

[浏览器同步]无法打开浏览器（如果您在无头环境中使用BrowserSync，则可能需要将打开选项设置为false）

警告图像

简化的WebPack配置文件（用于开发）

const path = require('path')
const webpack = require('webpack')
const recursive = require('recursive-readdir-sync')
const HtmlWebpackPlugin = require('html-webpack-plugin')
const Dotenv = require('dotenv-webpack')
const BrowserSyncPlugin = require('browser-sync-webpack-plugin')
const srcDir = path.resolve(__dirname, '..', 'src')
const distDir = path.resolve(__dirname, '..', 'dist')
const {NODE_ENV = 'development'} = process.env

module.exports = {
    context: srcDir,
    devtool: 'source-map',
    entry: ['./index.js'],
    output: {
        filename: 'main.js',
        path: distDir,
        publicPath: '/',
        sourceMapFilename: 'main.map'
    },
    devServer: {
        contentBase: srcDir,
        publicPath: '/',
        historyApiFallback: true,
        host: '0.0.0.0',
        port: 4444,
    },
    watchOptions: {
        usePolling: true
    },
    plugins: 
        [
            new BrowserSyncPlugin(
                // BrowserSync options
                {
                    host: '0.0.0.0',
                    port: 4000,
                    proxy: 'http://0.0.0.0:4444/'
                },
                // BrowserSync WebPack plugin options
                {
                    reload: false
                }
            )
        ],
    )
}

Package.json脚本和依赖项

  "scripts": {
    "clean": "rimraf dist",
    "start": "npm run watch && npm run serve",
    "serve": "webpack-dev-server --progress --colors",
    "watch": "webpack",
    "build": "npm run clean && NODE_ENV=production webpack",
    "lint": "eslint src config",
  },
  "devDependencies": {
    "autoprefixer": "^7.1.2",
    "babel-core": "^6.25.0",
    "babel-eslint": "^7.2.3",
    "babel-loader": "^7.1.1",
    "babel-preset-es2015": "^6.24.1",
    "babel-preset-stage-0": "^6.24.1",
    "browser-sync": "^2.18.13",
    "browser-sync-webpack-plugin": "^1.2.0",
    "compression-webpack-plugin": "^0.4.0",
    "css-loader": "^0.28.0",
    "eslint": "^4.2.0",
    "eslint-config-standard": "^10.2.1",
    "eslint-plugin-babel": "^4.1.1",
    "eslint-plugin-import": "^2.7.0",
    "eslint-plugin-node": "^5.1.0",
    "eslint-plugin-promise": "^3.5.0",
    "eslint-plugin-standard": "^3.0.1",
    "extract-text-webpack-plugin": "^3.0.0",
    "file-loader": "^0.11.2",
    "handlebars": "^3.0.3",
    "handlebars-loader": "^1.5.0",
    "html-webpack-plugin": "^2.29.0",
    "node-sass": "^4.5.3",
    "postcss-loader": "^2.0.6",
    "preload-webpack-plugin": "^1.2.2",
    "recursive-readdir-sync": "^1.0.6",
    "rimraf": "^2.6.1",
    "sass-loader": "^6.0.6",
    "style-loader": "^0.18.2",
    "url-loader": "^0.5.8",
    "webpack": "^3.8.1",
    "webpack-dev-server": "^2.5.1"
  },
  "dependencies": {
    "bootstrap": "^3.3.7",
    "dotenv-webpack": "^1.5.4",
    "jquery": "^3.2.1",
    "normalize.css": "^7.0.0",
    "scrollreveal": "^3.3.6"
  }

Docker撰写文件（来自Container的部分）

  //...
  ports:
    - "${WORKSPACE_SSH_PORT}:22"
    - "4000:4000"
    - "4444:4444"
    - "3001:3001"
  //...