The docs are wrong... 😢

Just use webpack-dev-server --hot --inline and don't anything special about webpack-dev-server or HMR to your webpack.config.js.

I'm getting this error as well.

I am seeing this error as well. Passing --hot --inline to the command line fixes it.

Thank you @sokra, that worked. Sorry for not updating here!

I'm going to keep this open until a maintainer closes it, hopefully the docs will be updated soon. I would do it myself but I don't know enough about HMR.

I'm getting the same, I had:

  devServer: {
    hot: true,
    inline: true
  }

in my webpage.config.js and was getting errors when running webpack-dev-server. However, running webpack-dev-server --hot --inline makes everything work as expected.

I have following in the config:

  devServer: {
    contentBase: "./src/www",
    noInfo: true,
    hot: true,
    inline: true
  }

The browser shows following log:

bundle.js:117 Uncaught Error: [HMR] Hot Module Replacement is disabled.
webpack-dev-server.js:1 [WDS] Hot Module Replacement enabled.

Running webpack-dev-server with --hot --inline does also not help.

I have the same issue as @lubosz

Hot Module Replacement is disabled. means the HotModuleReplacementPlugin is not used.

--hot adds it. (because the CLI have access to your webpack configuration)

hot: true doesn't add it. (because the API doesn't have access to your webpack configuration)

You have to push new webpack.HotModuleReplacementPlugin() this into your plugins config, webpack-dev-server when used with nodejs api do not add it automatically

var config = require('webpack.config');
config.plugins.push(new webpack.HotModuleReplacementPlugin())

I change from devServer stuff on the webpack config into --hot --inline in the CLI command and works perfectly. Also, using a express and handling the webpack config works too...

@mailaneel Thanks! Your solution works!

@mailaneel Thanks!+1

var debug = process.env.NODE_ENV !== "production";
var webpack = require('webpack');
var path = require('path');
module.exports = {
  context: path.join(__dirname, "/"),
  devtool: debug ? "inline-sourcemap" : null,
  entry: ["webpack/hot/dev-server", "./src/start.jsx"],
  module: {
    loaders: [
      {
        test: /\.jsx?$/,
        exclude: /(node_modules|bower_components)/,
        loader: 'babel-loader',
        query: {
          presets: ['react', 'es2015', 'stage-0'],
          plugins: ['react-html-attrs', 'transform-class-properties', 'transform-decorators-legacy'],
        }
      }
    ]
  },
  output: {
    path: __dirname + "/build/js/",
    filename: "script.js",
    publicPath: "/build/js/"
  },
  plugins: debug ? [] : [
    new webpack.optimize.DedupePlugin(),
    new webpack.optimize.OccurenceOrderPlugin(),
    new webpack.optimize.UglifyJsPlugin({ mangle: false, sourcemap: false }),
  ],
};

Here is my webpack config. I have following folder structure:

-app
  -build
    -js
       -script.js
  -src
    -start.js

I am compiling start.js in 'src' folder to 'script.js' in 'build/js' folder.

Running it with webpack is compiling exactly as I intended, however running webpack-dev server as:

webpack-dev-server --content-base ./build --hot --inline

is not doing as intended. However, in terminal it is showing compilation.