Webpack hmr: __webpack_hmr 404 not found

问题:

I'm using webpack-dev-server for hot module replacement. It's working just fine, but this error keeps showing up in the console every couple of seconds: GET http://mysite:8080/__webpack_hmr 404 (Not Found).

Here's my 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'         }]     }   }; 

The idea is that the dev-server should forward all requests except from / and __webpack_hmr to my backend (my-backend.localhost). This works fine for everything except __webpack_hmr.

Is there something I can change in my conf to make the error disappear?

回答1:

Fixed by deleting the following line under entry: 'webpack-hot-middleware/client?path=http://'+hostname+':'+port+'/__webpack_hmr'. I don't know why it worked. See Amin Ariana's answer for an explanation to why this may work for you.

回答2:

This line in entry array does not play well with webpack-dev-server:

webpack-hot-middleware/client 

because it's a requirement of webpack-hot-middleware for working with any server other than webpack-dev-server (such as express or some such).

I ran into this mixed-server issue by following Webpack tutorials. They should update it so that the entry point for the config file of Webpack using webpack-dev-server doesn't require an artifact produced by webpack-hot-middleware, which tries to hot-emit the developer's module updates into a custom-built server depending on it.

You can remove that line from the entry array, which in case of using dev-server should solve the problem.

FYI That line in your code came from here: https://github.com/webpack-contrib/webpack-hot-middleware where it says:

Add webpack-hot-middleware/client?... into the [webpack config's] entry array. This connects to the server to receive notifications when the bundle rebuilds and then updates your client bundle accordingly.

Based on your question, "I'm using webpack-dev-server", you're therefore not using "webpack-hot-middleware" and should remove the entry line.

文章来源: Webpack hmr: __webpack_hmr 404 not found