build(webpack): update to webpack-serve

`webpack-dev-server` is not compatible with `webpack-command`. It is
also slow, old and in maintenance-only mode.

Update to `webpack-serve` which is a more modern and faster alternative.

See:
 - https://github.com/webpack/webpack-dev-server#project-in-maintenance
 - http://shellscape.org/2018/02/12/webpack-serve-up-whoopass

package.json

@@ -29,7 +29,7 @@
     "prestart": "npm run build",
     "start": "cross-env NODE_ENV=production electron ./app/",
     "start-main-dev": "cross-env HOT=1 NODE_ENV=development electron -r babel-register ./app/main.dev",
-    "start-renderer-dev": "node --trace-warnings -r babel-register ./node_modules/webpack-dev-server/bin/webpack-dev-server --config webpack.config.renderer.dev.js",
+    "start-renderer-dev": "node --trace-warnings -r babel-register ./node_modules/.bin/webpack-serve --config webpack.config.renderer.dev.js",
     "test": "cross-env NODE_ENV=test BABEL_DISABLE_CACHE=1 node --trace-warnings ./test/runTests.js",
     "test-ci": "npm run package && npm run test && npm run test-e2e",
     "test-all": "npm run lint && npm run lint-styles && npm run flow && npm run build && npm run test && npm run test-e2e",
@@ -166,6 +166,7 @@
     "browserslist": "^4.0.0",
     "chalk": "^2.4.1",
     "concurrently": "^3.6.0",
+    "connect-history-api-fallback": "^1.5.0",
     "cross-env": "^5.2.0",
     "cross-spawn": "^6.0.5",
     "csp-html-webpack-plugin": "^2.3.0",
@@ -196,10 +197,12 @@
     "flow-runtime": "^0.17.0",
     "flow-typed": "^2.1.2",
     "html-webpack-plugin": "^3.2.0",
+    "http-proxy-middleware": "^0.18.0",
     "husky": "^1.0.0-rc.9",
     "identity-obj-proxy": "^3.0.0",
     "jest": "^23.1.0",
     "jsdom": "^11.0.0",
+    "koa-connect": "^2.0.1",
     "lint-staged": "^7.2.0",
     "minimist": "^1.2.0",
     "node-sass": "^4.9.0",
@@ -219,8 +222,8 @@
     "webpack": "^4.12.0",
     "webpack-bundle-analyzer": "^2.13.1",
     "webpack-command": "^0.4.1",
-    "webpack-dev-server": "^3.1.4",
+    "webpack-merge": "^4.1.3",
-    "webpack-merge": "^4.1.3"
+    "webpack-serve": "^2.0.2"
   },
   "dependencies": {
     "axios": "^0.16.2",

webpack.config.renderer.dev.js

@@ -11,6 +11,9 @@ import path from 'path'
 import fs from 'fs'
 import webpack from 'webpack'
 import merge from 'webpack-merge'
+import convert from 'koa-connect'
+import history from 'connect-history-api-fallback'
+import proxy from 'http-proxy-middleware'
 import { spawn, execSync } from 'child_process'
 import ExtractTextPlugin from 'extract-text-webpack-plugin'
 import HtmlWebpackPlugin from 'html-webpack-plugin'
@@ -43,7 +46,6 @@ export default merge.smart(baseConfig, {
 
   entry: [
     'react-hot-loader/patch',
-    `webpack-dev-server/client?http://localhost:${port}/`,
     'webpack/hot/only-dev-server',
     path.join(__dirname, 'app/index.js')
   ],
@@ -206,14 +208,6 @@ export default merge.smart(baseConfig, {
       sourceType: 'var'
     }),
 
-    /**
-     * https://webpack.js.org/concepts/hot-module-replacement/
-     */
-    new webpack.HotModuleReplacementPlugin({
-      // @TODO: Waiting on https://github.com/jantimon/html-webpack-plugin/issues/533
-      // multiStep: true
-    }),
-
     new webpack.LoaderOptionsPlugin({
       debug: true
     }),
@@ -267,60 +261,92 @@ export default merge.smart(baseConfig, {
     __filename: false
   },
 
-  devServer: {
+  serve: {
     port,
+    content: path.join(__dirname, 'dist'),
+    hotClient: {
+      validTargets: ['electron-renderer']
+    },
+    devMiddleware: {
       publicPath,
-    compress: true,
-    noInfo: true,
       stats: 'errors-only',
-    inline: true,
-    lazy: false,
-    hot: true,
       headers: { 'Access-Control-Allow-Origin': '*' },
-    contentBase: path.join(__dirname, 'dist'),
       watchOptions: {
         aggregateTimeout: 300,
         ignored: /node_modules/,
         poll: 100
+      }
     },
-    proxy: {
+    // Add middleware to proxy requests to selected remote sites.
-      '/proxy/zap.jackmallers.com': {
+    add: app => {
+      app.use(
+        convert(
+          proxy('/proxy/zap.jackmallers.com', {
             target: 'https://zap.jackmallers.com',
             pathRewrite: { '^/proxy/zap.jackmallers.com': '' },
             changeOrigin: true
-      },
+          })
-      '/proxy/api.coinmarketcap.com': {
+        )
+      )
+      app.use(
+        convert(
+          proxy('/proxy/api.coinmarketcap.com', {
             target: 'https://api.coinmarketcap.com',
             pathRewrite: { '^/proxy/api.coinmarketcap.com': '' },
             changeOrigin: true
-      },
+          })
-      '/proxy/testnet-api.smartbit.com.au': {
+        )
+      )
+      app.use(
+        convert(
+          proxy('/proxy/testnet-api.smartbit.com.au', {
             target: 'https://testnet-api.smartbit.com.au',
             pathRewrite: { '^/proxy/testnet-api.smartbit.com.au': '' },
             changeOrigin: true
-      },
+          })
-      '/proxy/tchain.api.btc.com': {
+        )
+      )
+      app.use(
+        convert(
+          proxy('/proxy/tchain.api.btc.com', {
             target: 'https://tchain.api.btc.com',
             pathRewrite: { '^/proxy/tchain.api.btc.com': '' },
             changeOrigin: true
-      },
+          })
-      '/proxy/api.blockcypher.com': {
+        )
+      )
+      app.use(
+        convert(
+          proxy('/proxy/api.blockcypher.com', {
             target: 'https://api.blockcypher.com',
             pathRewrite: { '^/proxy/api.blockcypher.com': '' },
             changeOrigin: true
-      }
+          })
-    },
+        )
-    historyApiFallback: {
+      )
+      app.use(
+        convert(
+          history({
             verbose: true,
             disableDotRule: false
+          })
+        )
+      )
     },
-    before() {
+    // Start the main process as soon as the server is listening.
+    on: {
+      listening: () => {
         if (process.env.START_HOT) {
-        spawn('npm', ['run', 'start-main-dev'], { shell: true, env: process.env, stdio: 'inherit' })
+          spawn('npm', ['run', 'start-main-dev'], {
+            shell: true,
+            env: process.env,
+            stdio: 'inherit'
+          })
             .on('close', code => process.exit(code))
             .on('error', spawnError => mainLog.error(spawnError))
         }
       }
+    }
   },
 
   optimization: {