webpack-dev-server报错Can't resolve 'webpack/hot

Question

问题:webpack-dev-server报错:Module not found: Error: Can't resolve 'webpack/hot

根据官方教程:http://webpack.github.io/docs...配置:

这个是我webpack.config.js文件:
var webpack = require('webpack');
var os = require('os');

const htmlWebpackPlugin = require('html-webpack-plugin');
const path= require("path")
const ExtractTextPlugin = require('extract-text-webpack-plugin');

module.exports = {

entry: {
  main:'./src/app.js',
  orders:'./src/orders.js',
  
},
devtool: 'inline-source-map',
output: {
    path: path.resolve(__dirname, "dist"),//打包后的文件存放的地方
    publicPath:path.join(__dirname,"/assets/"),
    filename: "js/[name].bundle.js",  //添加js为了使生成的js文件与html分离
},
// devServer: {
//   stats:'errors-only',
//   compress: true,
//   contentBase: path.join(__dirname),//本地服务器所加载的页面所在的目录
//   historyApiFallback: true,//不跳转
//   inline: true,//实时刷新
//   //hot: true
// },
module:{
  rules:[
    {
      test: /\.css$/,
      use: extractCSS.extract({
      // use style-loader 当不独立的时候内嵌到html中
      fallback: "style-loader",
      publicPath:'https://cdn/com/',
      use:[ 'css-loader',
          {
            loader:'postcss-loader',
            options:{
              plugins:(loader) => [
                require('postcss-import')({ root: loader.resourcePath }),//与css-loader'功能类似?也用于解释css文件的import
                require('autoprefixer')({
                  browsers: ['last 2 versions'],
                }),
              ]
            }
           }
        ]
      }),
    },{
        test: /\.less$/,
        use: [
        //   {
        //     loader: "style-loader" // creates style nodes from JS strings  //当独立css出来时不能加这个
        // },
        {
            loader: "css-loader" // translates CSS into CommonJS
        }, {
            loader: "less-loader" // compiles Less to CSS
        },{
            loader:'postcss-loader',
              options:{
                plugins:(loader) => [
                  require('postcss-import')({ root: loader.resourcePath }),//与css-loader'功能类似?也用于解释css文件的import
                  require('autoprefixer')({
                    browsers: ['last 2 versions'],
                  }),
                ]
              }
        }
      ]
    },{
        test: /\.scss$/,
        use: [
          // {
          //   loader: "style-loader" // creates style nodes from JS strings   //当独立css出来时不能加这个
          // },
          {
            loader: "css-loader" // translates CSS into CommonJS
          }, {
            loader: "sass-loader" // compiles Less to CSS
          },{
            loader:'postcss-loader',
              options:{
                plugins:(loader) => [
                  require('postcss-import')({ root: loader.resourcePath }),
                  require('autoprefixer')({
                    browsers: ['last 2 versions'],
                  }),
                ]
              }
        }
      ]
    }]
},
plugins:[
  new htmlWebpackPlugin({
    filename:'index.html',
    template:'index.html',
    inject:'body',
    chunks:['main','vendor'],
    minify:{    //压缩HTML文件
       removeComments:true,    //移除HTML中的注释
       collapseWhitespace:false    //删除空白符与换行符
    }
  }),
  new htmlWebpackPlugin({
    filename:'index.html',
    template:'index.html',
    inject:'body',
    chunks:['main','vendor']
  }),
  new htmlWebpackPlugin({
    filename:'orders.html',
    template:'orders.html',
    inject:'body',
    title:'orders',
    chunks:['main','orders','vendor']
  }),

  //new webpack.HotModuleReplacementPlugin(),//热加载
  //new webpack.NamedModulesPlugin()
],    

};

以下是报错信息:
ERROR in ./node_modules/webpack-dev-server/client?http://localhost:8080
Module not found: Error: Can't resolve 'webpack/hot' in '/home/xuan/webpack-demo1/node_modules/webpack-dev-server/client'
@ ./node_modules/webpack-dev-server/client?http://localhost:8080 79:15-65
@ multi ./node_modules/webpack-dev-server/client?http://localhost:8080 ./src/app.js

ERROR in ./node_modules/webpack-dev-server/client?http://localhost:8080
Module not found: Error: Can't resolve 'webpack/hot/emitter' in '/home/xuan/webpack-demo1/node_modules/webpack-dev-server/client'
@ ./node_modules/webpack-dev-server/client?http://localhost:8080 194:19-49
@ multi ./node_modules/webpack-dev-server/client?http://localhost:8080 ./src/app.js

Answer 1

看一下https://segmentfault.com/q/10...的答案是不是你要的

重新安装webpack：npm install webpack（不加-g）;

Answer 2

楼上的方法并不能有效解决这个问题，亲试无效
这个问题的原因是因为你依赖的webpack-dev-server有bug,只需要将packjson.js文件里的webpack-dev-server依赖的版本更改成指定版本就可以
如：^3.1.0 => 3.1.0类似这样

Answer 3

请问这个问题怎么解决了？我也遇到了