webpack-dev-server热负载不能与boot2docker一起使用

时间:2015-06-17 23:54:40

标签: docker boot2docker webpack webpack-dev-server

我目前正试图通过boot2docker让docker-osx-devhot loading合作。

我使用--host 0.0.0.0在容器中正确拾取了文件更改,但socket.io热重新加载无法正常工作。

原因是我在运行服务器时设置了0.0.0.0,因此它可以在我的主机上访问。但是,这意味着它正在http://0.0.0.0:8080/socket.io/?EIO=3&transport=polling&t=1434584701670-0寻找socket.io服务器。

因此,当我加载页面时,它会尝试连接到http://dockerhost:8080/socket.io/,我的领事出错了。实际上它应该连接到webpack-dev-server

有没有告诉{{1}}使用不同的主机来获取socket.io连接?

The Github issue 63可能会引用相同的问题,但尚未解决。

4 个答案:

答案 0 :(得分:1)

所以我意识到即使它在控制台中给我一个错误,通过尝试连接到错误的主机,它也连接到正确的主机,因此热负载确实有效。

最后,我的配置看起来像这样:

var entry = ["./config/mainApp"];
var loaders = {
    "jsx": ["react-hot", "babel-loader?stage=0"]
    "js": {
        loader: "babel-loader?stage=0",
        include: path.join(__dirname, "app")
    },
    "json": "json-loader",
    "json5": "json5-loader",
    "txt": "raw-loader",
    "png|jpg|jpeg|gif|svg": "url-loader?limit=10000",
    "woff|woff2": "url-loader?limit=100000",
    "ttf|eot": "file-loader",
    "wav|mp3": "file-loader",
    "html": "html-loader",
    "md|markdown": ["html-loader", "markdown-loader"],
    "css": "style-loader!css-loader"
};
var preloaders = {
    "js": "source-map-loader"
};
var plugins = [
    new webpack.PrefetchPlugin("react"),
    new HtmlWebpackPlugin({
        inject: true,
        template: "app/index.html"
    }),
    new webpack.PrefetchPlugin("react/lib/ReactComponentBrowserEnvironment")
];
module.exports = {
    entry: entry,
    output: {
        path: path.join(__dirname, "dist"),
        filename: "bundle.js",
        sourceMapFilename: "bundle.map",
        pathinfo: true
    },
    module: {
        loaders: loadersByExtension(loaders),
        preloaders: loadersByExtension(preloaders)
    },
    devtool: "eval-source-map",
    debug: true,
    resolve: {
        root: path.join(__dirname, "app"),
        extensions: ["", ".web.js", ".js", ".jsx"]
    },
    plugins: plugins,
    devServer: {
        port: 8080,
        host: "0.0.0.0",
        inline: true
    }
};

我就是这样开始的:

webpack-dev-server --config webpack-hot-dev-server.config.js --colors --progress --hot

完整示例check out my the initial stages of my app that just has this boilerplate + react

答案 1 :(得分:1)

switched使用https://github.com/brikis98/docker-osx-dev使用rsync在OS X和容器之间同步文件,并为http://dockerhost添加允许socket.io正确轮询容器的主机条目来自OS X网络浏览器。

答案 2 :(得分:1)

经过几个小时的搜索后我得到了found,这个内联选项只是增加了入口点。您可以通过将local.host(在您的情况下为0.0.0.0)替换为localhost或其他主机来修复此错误。

检测文件更改的最简单方法是将watchOptions.poll设置为true。

答案 3 :(得分:0)

在这里解决了一些问题后解决方案:

1-将主机名添加到 / etc / hosts

YOUR_DOCKER_MACHINE_IP    devapp (or any other hostname you choose)

2-在您的webpackconfig条目

entry: 
    main: [
        'webpack-dev-server/client?http://devapp:YOUR_EXPOSED_PORT',
        'webpack/hot/only-dev-server',
        YOUR_SCRIPT_FILE
    ]
}