找不到模块：错误：使用webpack-hot-middleware时，无法解析'webpack-hot-Middleware / client？path = / __ webpack_hmr＆timeout = 20000＆reload = true'

Question

我正在使用webpack-hot-middleware替换Express应用程序中javascript ui脚本的热模块。每当我启动服务器时，都会出现此错误： 找不到模块：错误：无法解析“ webpack-hot-middleware / client？path = / __ webpack_hmr＆timeout = 20000＆reload = true”。

这是我在Web服务器中编译的Webpack配置：

const path = require('path');

module.exports = {
  mode: 'development',
  devtool: 'source-map',
  entry: [ path.join(__dirname, 'ui/lib/utilities/index.js') , 'webpack-hot-middleware/client?path=/__webpack_hmr&timeout=20000&reload=true' ],
  output: {
    path: path.join(__dirname, 'ui/dist'),
    filename: '[name].js',
    publicPath: 'http://localhost:3000'
  },
  resolve: {
    extensions: [
      '.js',
    ],
  },
  module: {
    rules: [
      {
        test: /\.js$/,
        exclude: /node_modules/, // exclude any and all files in the node_modules folder
        include: path.resolve(__dirname, 'scripts'),
        use: [
          {
            loader: 'babel-loader',
            options: {
              presets: ['env', 'es2015'],
              plugins: [
                // OccurrenceOrderPlugin is needed for webpack 1.x only
                new webpack.optimize.OccurrenceOrderPlugin(),
                new webpack.HotModuleReplacementPlugin(),
                // Use NoErrorsPlugin for webpack 1.x
                new webpack.NoEmitOnErrorsPlugin()
              ],
              camelcase: true,
              emitErrors: false,
              failOnHint: false,
            },
          },
          { loader: 'style-loader' },
          { loader: 'css-loader' },
        ],
      },
    ],
  },
};

这是服务器代码中的编译：

  web.use(webpackDevMiddleware(compiler, {
    noInfo: true,
    publicPath: webpackConfig.output.publicPath,
    writeToDisk: true,
    hot: true
  }));
  web.use(require("webpack-hot-middleware")(compiler, {
    log: console.log, path: '/__webpack_hmr', heartbeat: 10 * 1000
  }));