title: webpack-dev-server --hot vs HotModuleReplacementPlugin()
body: <p>With the following config, I have been able to get hot module replacement working with HotModuleReplacementPlugin(), but not by using --hot when running the webpack-dev-server. My question is, why?</p>
  
  <p>Almost all recent guides to setting up hot module replacement use --hot, but it doesn't work for me. </p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>var webpack = require("webpack");
  var path = require("path");
   
  const config = {
    entry: path.resolve(__dirname, 'app/index.js') ,
    output: {
      path: path.resolve(__dirname, 'output'),
      filename: 'bundle.js',
      publicPath: "static/"
    },
    module: {
      rules: [
        {test: /\.(js|jsx)$/, use: 'babel-loader'}
      ]
    },
    plugins: [
      new webpack.HotModuleReplacementPlugin()
    ]
  
  };
   
  module.exports = config;</code></pre>
  </div>
  </div>
  </p>
  
  <p>I am referencing my code file like so.</p>
  
  <pre><code>&lt;script src="static/bundle.js"&gt;&lt;/script&gt;
  </code></pre>
  
  <p>I am running my server like so.</p>
  
  <pre><code>webpack-dev-server --inline --colors --progress
  </code></pre>
  
  <p>Version.</p>
  
  <pre><code>webpack-dev-server 2.3.0
  webpack 2.2.1
  </code></pre>
  
  <p>With this setup, hot module loading is working correctly. If I remove the plugin, and run the server appending --hot (as I've seen in many examples), my hot module loading doesn't work. The server registers the change, the transpile happens, my webpage appears like it's reloading, but the content does not update.</p>
  
  <p>I'm accessing through <a href="http://localhost:8080/webpack-dev-server/index.html" rel="noreferrer">http://localhost:8080/webpack-dev-server/index.html</a></p>
  
  <p>Structure looks like this + a node_modules directory.</p>
  
  <pre><code>.
  ├── app
  │   └── index.js
  ├── index.html
  ├── output
  │   ├── bundle.js
  │   └── index.js
  ├── package.json
  └── webpack.config.js
  </code></pre>
  
  <hr>
  
  <p><strong>Update</strong></p>
  
  <p>Have also tried adding devServer to the webpack config, which has the same result.</p>
  
  <pre><code>devServer: {
  compress: true,
  publicPath: "http://localhost:8080/static/",
  filename: "bundle.js",
  hot: true,
  inline: true
  </code></pre>
  
  <p>}</p>