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

Update to webpack-command and webpack-serve
7 years ago · 1b088b7312
3 changed files with 557 additions and 527 deletions
--- a/package.json
+++ b/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-main": "node --trace-warnings -r babel-register ./node_modules/webpack/bin/webpack --config webpack.config.main.prod.js --colors",
-    "build-renderer": "node --trace-warnings -r babel-register ./node_modules/webpack/bin/webpack --config webpack.config.renderer.prod.js --colors",
+    "build-dll": "webpack --require babel-register --config webpack.config.renderer.dev.dll.js --progress",
+    "build-main": "webpack --require babel-register  --config webpack.config.main.prod.js --progress",
+    "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-dev-server": "^3.1.4",
-    "webpack-merge": "^4.1.3"
+    "webpack-command": "^0.4.1",
+    "webpack-merge": "^4.1.3",
+    "webpack-serve": "^2.0.2"
  },
  "dependencies": {
    "axios": "^0.16.2",
--- a/webpack.config.renderer.dev.js
+++ b/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,
-    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
+    content: path.join(__dirname, 'dist'),
+    hotClient: {
+      validTargets: ['electron-renderer']
    },
-    proxy: {
-      '/proxy/zap.jackmallers.com': {
-        target: 'https://zap.jackmallers.com',
-        pathRewrite: { '^/proxy/zap.jackmallers.com': '' },
-        changeOrigin: true
-      },
-      '/proxy/api.coinmarketcap.com': {
-        target: 'https://api.coinmarketcap.com',
-        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
+    devMiddleware: {
+      publicPath,
+      stats: 'errors-only',
+      headers: { 'Access-Control-Allow-Origin': '*' },
+      watchOptions: {
+        aggregateTimeout: 300,
+        ignored: /node_modules/,
+        poll: 100
      }
    },
-    historyApiFallback: {
-      verbose: true,
-      disableDotRule: false
+    // Add middleware to proxy requests to selected remote sites.
+    add: app => {
+      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() {
-      if (process.env.START_HOT) {
-        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))
+    // 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'
+          })
+            .on('close', code => process.exit(code))
+            .on('error', spawnError => mainLog.error(spawnError))
+        }
      }
    }
  },
--- a/yarn.lock
+++ b/yarn.lock