Webpack hmr : __webpack_hmr 404 not found

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-dev-server不能很好地配合:

webpack-hot-middleware/client

因为这是 webpack-hot-middleware 与 webpack-dev-server 之外的任何服务器一起使用的要求(例如 express或类似的)。

我按照 Webpack 教程遇到了这个混合服务器问题。他们应该更新它，以便使用 webpack-dev-server 的 Webpack 配置文件的入口点不需要 webpack-hot-middleware 生成的工件，该工件试图将开发人员的模块更新热发射到自定义构建中服务器取决于它。

您可以从条目数组中删除该行，在使用开发服务器的情况下应该可以解决问题。

仅供引用，您代码中的那一行来自这里: https://github.com/webpack-contrib/webpack-hot-middleware它说:

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.

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