Merge pull request #498 from mrfelton/build/webpack-command-and-serve

Update to webpack-command and webpack-serve

package.json

@@ -5,9 +5,9 @@
   "description": "desktop application for the lightning network",
   "scripts": {
     "build": "concurrently --raw \"npm:build-main\" \"npm:build-renderer\"",
-    "build-dll": "node --trace-warnings -r babel-register ./node_modules/webpack/bin/webpack --config webpack.config.renderer.dev.dll.js --colors",
+    "build-dll": "webpack --require babel-register --config webpack.config.renderer.dev.dll.js --progress",
-    "build-main": "node --trace-warnings -r babel-register ./node_modules/webpack/bin/webpack --config webpack.config.main.prod.js --colors",
+    "build-main": "webpack --require babel-register  --config webpack.config.main.prod.js --progress",
-    "build-renderer": "node --trace-warnings -r babel-register ./node_modules/webpack/bin/webpack --config webpack.config.renderer.prod.js --colors",
+    "build-renderer": "webpack --require babel-register --config webpack.config.renderer.prod.js --progress",
     "dev": "cross-env START_HOT=1 npm run start-renderer-dev",
     "flow": "flow",
     "flow-typed": "rimraf flow-typed/npm && flow-typed install --overwrite || true",
@@ -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",
@@ -218,9 +221,9 @@
     "url-loader": "^1.0.1",
     "webpack": "^4.12.0",
     "webpack-bundle-analyzer": "^2.13.1",
-    "webpack-cli": "^3.0.7",
+    "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,58 +261,90 @@ export default merge.smart(baseConfig, {
     __filename: false
   },
 
-  devServer: {
+  serve: {
     port,
-    publicPath,
+    content: path.join(__dirname, 'dist'),
-    compress: true,
+    hotClient: {
-    noInfo: true,
+      validTargets: ['electron-renderer']
-    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: {
+    devMiddleware: {
-      '/proxy/zap.jackmallers.com': {
+      publicPath,
-        target: 'https://zap.jackmallers.com',
+      stats: 'errors-only',
-        pathRewrite: { '^/proxy/zap.jackmallers.com': '' },
+      headers: { 'Access-Control-Allow-Origin': '*' },
-        changeOrigin: true
+      watchOptions: {
-      },
+        aggregateTimeout: 300,
-      '/proxy/api.coinmarketcap.com': {
+        ignored: /node_modules/,
-        target: 'https://api.coinmarketcap.com',
+        poll: 100
-        pathRewrite: { '^/proxy/api.coinmarketcap.com': '' },
-        changeOrigin: true
-      },
-      '/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': {
-        target: 'https://tchain.api.btc.com',
-        pathRewrite: { '^/proxy/tchain.api.btc.com': '' },
-        changeOrigin: true
-      },
-      '/proxy/api.blockcypher.com': {
-        target: 'https://api.blockcypher.com',
-        pathRewrite: { '^/proxy/api.blockcypher.com': '' },
-        changeOrigin: true
       }
     },
-    historyApiFallback: {
+    // Add middleware to proxy requests to selected remote sites.
-      verbose: true,
+    add: app => {
-      disableDotRule: false
+      app.use(
+        convert(
+          proxy('/proxy/zap.jackmallers.com', {
+            target: 'https://zap.jackmallers.com',
+            pathRewrite: { '^/proxy/zap.jackmallers.com': '' },
+            changeOrigin: true
+          })
+        )
+      )
+      app.use(
+        convert(
+          proxy('/proxy/api.coinmarketcap.com', {
+            target: 'https://api.coinmarketcap.com',
+            pathRewrite: { '^/proxy/api.coinmarketcap.com': '' },
+            changeOrigin: true
+          })
+        )
+      )
+      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
+          })
+        )
+      )
+      app.use(
+        convert(
+          proxy('/proxy/tchain.api.btc.com', {
+            target: 'https://tchain.api.btc.com',
+            pathRewrite: { '^/proxy/tchain.api.btc.com': '' },
+            changeOrigin: true
+          })
+        )
+      )
+      app.use(
+        convert(
+          proxy('/proxy/api.blockcypher.com', {
+            target: 'https://api.blockcypher.com',
+            pathRewrite: { '^/proxy/api.blockcypher.com': '' },
+            changeOrigin: true
+          })
+        )
+      )
+      app.use(
+        convert(
+          history({
+            verbose: true,
+            disableDotRule: false
+          })
+        )
+      )
     },
-    before() {
+    // Start the main process as soon as the server is listening.
-      if (process.env.START_HOT) {
+    on: {
-        spawn('npm', ['run', 'start-main-dev'], { shell: true, env: process.env, stdio: 'inherit' })
+      listening: () => {
-          .on('close', code => process.exit(code))
+        if (process.env.START_HOT) {
-          .on('error', spawnError => mainLog.error(spawnError))
+          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))
+        }
       }
     }
   },