Webpack hmr:找不到__webpack_hmr 404

Question

我正在使用webpack-dev-server进行热模块更换.它运行得很好,但这个错误每隔几秒就会在控制台中显示:GET http://mysite:8080/__webpack_hmr 404 (Not Found).

这是我的webpack.config.js:

var webpack = require('webpack'),
    hostname = 'mysite',
    port = 8080;

module.exports = {
    entry: [
        'babel-polyfill',
        './src/js/main.js',
        './dev/requireCss.js',
        'webpack/hot/dev-server',
        // I'm assuming the fault lies in the following line, but I can't figure out what's wrong
        'webpack-hot-middleware/client?path=http://'+hostname+':'+port+'/__webpack_hmr'
    ],
    output: {
        path: __dirname + '/webpack',
        filename: "bundle.js",
        publicPath: 'http://'+hostname+':'+port+'/'
    },
    module: {
        loaders: [{
            test: /\.jsx?$/,
            exclude: /(node_modules|bower_components)/,
            loaders: ['react-hot', 'babel-loader?presets[]=react&presets[]=es2015']
        } // removed some loaders for brevity
        ]
    },
    resolve: {
        extensions: ['', '.json', '.js', '.jsx']
    },
    plugins: [
        new webpack.HotModuleReplacementPlugin()
    ],
    devtool: "source-map",
    devServer: {
        contentBase: __dirname + '/dev',
        hot: true,
        proxy: [{
            path: /\/(?!__webpack_hmr).+/, // I get the same error if I change this to 'path: /\/.+/'
            target: 'http://my-backend.localhost'
        }]
    }


};

这个想法是开发服务器应该转发除我/和__webpack_hmr后端(my-backend.localhost)之外的所有请求.这适用于除了之外的一切__webpack_hmr.

有什么东西我可以在我的conf中改变以使错误消失吗？

Answer 1

通过删除条目下的以下行来修复: 'webpack-hot-middleware/client?path=http://'+hostname+':'+port+'/__webpack_hmr'.我不知道为什么会奏效.请参阅Amin Ariana的答案,了解为什么这对您有用.

Answer 2

条目数组中的此行不适用于webpack-dev-server：

webpack-hot-middleware/client

因为这是webpack-hot-middleware与其他服务器webpack-dev-server（例如express或此类服务器）一起使用的要求。

通过遵循Webpack教程，我遇到了这个混合服务器问题。他们应该对其进行更新，以使使用webpack-dev-server的Webpack配置文件的入口点不需要webpack-hot-middleware生成的工件，该工件会尝试将开发人员的模块更新热发射到定制的服务器取决于它。

您可以从条目数组中删除该行，这在使用dev-server的情况下应该可以解决该问题。

仅供参考，您的代码中的这一行来自此处：https : //github.com/webpack-contrib/webpack-hot-middleware ，其中说：

添加webpack-hot-middleware/client?...到[webpack配置的]条目数组中。这将连接到服务器以在捆绑软件重建时接收通知，然后相应地更新客户端捆绑软件。

根据您的问题“我正在使用webpack-dev-server”，因此您没有在使用“ webpack-hot-middleware”，因此应删除输入行。