title: webpack-hot-middleware doesn't generate hot-update.json file
body: <p>I'm trying to get up and running my app using <code>webpack-dev-middleware</code>, webpack-hot-middle-ware, express and react. But when I startup my code, system doesn't give me [hash].hot-update.json file. When I change something in my code system rebuilds and give such file but with wrong hash in file name. Here is my code:</p>
  
  <p>entry point for development server:</p>
  
  <pre><code>require('ignore-styles').default(undefined, (module, filename) =&gt; {
    if ((['.png', '.jpg'].some(ext =&gt; filename.endsWith(ext)) )) {
      module.exports = '/build/' + path.basename(filename);
    }
  });
  require('babel-register')({
      ignore: [ /(node_modules)/ ],
      presets: ["env", "stage-0", "react"],
      plugins: [
          'dynamic-import-node',
          'syntax-dynamic-import',
          'react-loadable/babel'
      ]
  });
  
  const express = require('express');
  const path = require('path');
  const webpack = require('webpack');
  const Loadable = require('react-loadable');
  const webpackDevMiddleware = require('webpack-dev-middleware');
  const serverRenderer = require('./server').default;
  
  const config = require('../configs/webpack.common.js');
  const compiler = webpack(config);
  
  const app = express();
  app.use(webpackDevMiddleware(compiler, { serverSideRender: true, publicPath: '/build/', }));
  app.use(require("webpack-hot-middleware")(compiler));
  app.use(serverRenderer());
  
  Loadable.preloadAll().then(() =&gt; {
      app.listen(3000, () =&gt; console.log('Development server is running on port 3000'));
  }).catch(err =&gt; {
      console.log(err);
  });
  </code></pre>
  
  <p>My webpack.config.js file:</p>
  
  <pre><code>module.exports = [{
      name: 'client',
      mode: 'development',
      target: 'web',
      entry: ['webpack-hot-middleware/client', './app/index.js'],
      output: {
          path: path.join(__dirname, '../build'),
          filename: 'client.js',
          publicPath: '/build/',
          hotUpdateChunkFilename: '[id].[hash].hot-update.js',
          hotUpdateMainFilename: '[hash].hot-update.json',
      },
      devtool: 'source-map',
      plugins: [
          new ManifestPlugin({
            writeToFileEmit: true,
          }),
          new WriteFilePlugin(),
          new webpack.HotModuleReplacementPlugin(),
      ],
      module: {
          rules: [
          {
              test: /\.js?$/,
              loader: 'babel-loader',
              exclude: /node_modules/
          },
          {
              test: /\.scss$/,
              use: ['style-loader', 'css-loader', 'sass-loader']
          },
          {
              test: /\.(png|jpg|gif|ico|jpeg)$/,
              use: [
                  {
                      loader: 'file-loader',
                      options: {
                          name: '[name].[ext]',
                      }
                  }
              ]
          }
      ],
  },
  },
  {
      name: 'server',
      mode: 'development',
      target: 'node',
      entry: './server/server.js',
      externals: [nodeExternals()],
      output: {
          path: path.join(__dirname, '../build'),
          filename: 'server.js',
          libraryTarget: 'commonjs2',
          publicPath: '/build/',
      },
      plugins: [
          new WriteFilePlugin(),
      ],
      module: {
          rules: [
          {
              test: /\.js?$/,
              loader: 'babel-loader',
              exclude: /node_modules/
          },
          {
              test: /\.scss$/,
              use: [
                  {
                      loader: 'style-loader',
                  },
                  {
                      loader: 'css-loader'
                  },
                  {
                      loader: 'sass-loader'
                  }
              ]
          },
          {
              test: /\.(png|jpg|gif|ico|jpeg)$/,
              use: [
                  {
                      loader: 'file-loader',
                      options: {
                          name: '[name].[ext]',
                          emitFile: false
                      }
                  }
              ]
          }
      ]
  }
  }];
  </code></pre>
  
  <p>My package.json file:</p>
  
  <pre><code>{
    "name": "xxx",
    "version": "1.0.0",
    "description": "",
    "main": "index.js",
    "scripts": {
      "start": "node server/development.js",
      "build": "rimraf build &amp;&amp; NODE_ENV=production webpack --config configs/webpack.production.js --progress --profile --colors",
      "prod": "node server/production.js"
    },
    "author": "",
    "license": "ISC",
    "devDependencies": {
      "babel-core": "^6.26.3",
      "babel-loader": "^7.1.4",
      "babel-plugin-dynamic-import-node": "^1.2.0",
      "babel-plugin-syntax-dynamic-import": "^6.18.0",
      "babel-preset-env": "^1.6.1",
      "babel-preset-react": "^6.24.1",
      "babel-preset-stage-0": "^6.24.1",
      "babel-register": "^6.26.0",
      "css-loader": "^0.28.11",
      "express": "^4.16.3",
      "file-loader": "^1.1.11",
      "ignore-styles": "^5.0.1",
      "mini-css-extract-plugin": "^0.4.0",
      "node-sass": "^4.9.0",
      "react-hot-loader": "^4.1.2",
      "rimraf": "^2.6.2",
      "sass-loader": "^7.0.1",
      "serialize-javascript": "^1.5.0",
      "style-loader": "^0.21.0",
      "uglifyjs-webpack-plugin": "^1.2.5",
      "webpack": "^4.6.0",
      "webpack-cli": "^2.0.15",
      "webpack-dev-middleware": "^3.1.3",
      "webpack-hot-middleware": "^2.22.1",
      "webpack-manifest-plugin": "^2.0.2",
      "webpack-merge": "^4.1.2",
      "webpack-node-externals": "^1.7.2",
      "write-file-webpack-plugin": "^4.3.2"
    },
    "dependencies": {
      "react": "^16.4.0",
      "react-dom": "^16.4.0",
      "react-helmet": "^5.2.0",
      "react-loadable": "^5.3.1",
      "react-redux": "^5.0.7",
      "react-router-config": "^1.0.0-beta.4",
      "react-router-dom": "^4.2.2",
      "redux": "^4.0.0",
      "redux-thunk": "^2.2.0"
    }
  }
  </code></pre>
  
  <p>and my server.js file:</p>
  
  <pre><code>import React from 'react'
  import { renderToString } from 'react-dom/server';
  import { StaticRouter } from 'react-router-dom';
  import { renderRoutes } from 'react-router-config';
  import { Provider } from 'react-redux'
  import { Helmet } from 'react-helmet';
  import Loadable from 'react-loadable';
  import serialize from 'serialize-javascript';
  import configureStore from '../app/store';
  import routes from '../app/routes';
  import template from './template';
  
  const store = configureStore();
  
  const normalizeAssets = (assets) =&gt; {
      return Array.isArray(assets) ? assets : [assets]
  };
  
  const searchModuleFiles = (modules, assets) =&gt; {
      return modules.map(module =&gt; {
          let files = [`${module}.js`, `${module}.css`];
          return files.map(file =&gt; ({ file: assets[file] }));
      })
  };
  
  export default (stats = null) =&gt; (req, res) =&gt; {
      const context = {};
      const modules = [];
      let devStats = [];
      let mainScript = null;
  
      const content = renderToString(
          &lt;Provider store={store}&gt;
              &lt;StaticRouter context={context} location={req.url}&gt;
                  &lt;Loadable.Capture report={moduleName =&gt; modules.push(moduleName)}&gt;
                      {renderRoutes(routes)}
                  &lt;/Loadable.Capture&gt;
              &lt;/StaticRouter&gt;
          &lt;/Provider&gt;
      );
  
      if(!stats) {
          let chunks = res.locals.webpackStats.toJson().children.filter(item =&gt; item.name === 'client')[0].assetsByChunkName;
          devStats = normalizeAssets(modules.map(module =&gt; chunks[module])[0]).map(item =&gt; ({ file: `/build/${item}` }));
          mainScript = { file: '/build/client.js' };
      } else {
          mainScript = { file: stats['main.js'] };
      }
  
      let bundles = stats ? searchModuleFiles(modules, stats)[0] : devStats;
      let scripts = bundles.filter(bundle =&gt; bundle.file.endsWith('.js'));
      let styles = bundles.filter(bundle =&gt; bundle.file.endsWith('.css'));
  
      const helmet = Helmet.renderStatic();
      const data = serialize(store.getState());
  
      res.status(200).send(template({ content, data, mainScript, scripts, styles, helmet }));
  }
  </code></pre>
  
  <p>Also any help about server side rendering wanted.</p>