fix: dev builds

packages/http/.gitignore

@@ -2,4 +2,5 @@
 /*.js.map
 !/.*
 !/webpack.config.js
+/build
 /client

packages/http/.neutrinorc.js

@@ -13,5 +13,8 @@ module.exports[0].use.push(copy({
   patterns: ['index.js', 'index.ejs', 'latus.js'].map((path) => ({
     from: `src/client/${path}`,
     to: 'client',
-  })),
+  })).concat(['.neutrinorc.js', 'webpack.config.js'].map((path) => ({
+    from: `src/build/${path}`,
+    to: 'build',
+  }))),
 }));

packages/http/package.json

@@ -14,6 +14,7 @@
     "watch": "NODE_PATH=./node_modules webpack --watch --mode development"
   },
   "files": [
+    "build",
     "client",
     "index.js",
     "index.js.map"
@@ -23,10 +24,12 @@
     "@neutrinojs/web": "^9.1.0",
     "debug": "4.3.1",
     "express": "^4.17.1",
+    "http-proxy": "^1.18.1",
     "memfs": "3.2.0",
     "neutrino": "9.4.0",
     "webpack": "^4",
     "webpack-dev-middleware": "^4.0.2",
+    "webpack-dev-server": "^3.11.0",
     "webpack-hot-middleware": "^2.25.0"
   },
   "devDependencies": {

packages/http/src/build/.neutrinorc.js

@@ -8,12 +8,15 @@ const {
   HTTP_DEV_HOST,
   HTTP_DEV_PORT,
   HTTP_DEV_PUBLIC,
+  NODE_ENV,
 } = process.env;
 
 module.exports = {
   use: [
     (neutrino) => {
-      const root = __dirname;
+      const root = process.argv.find((arg) => 'production' === arg)
+        ? __dirname
+        : `${__dirname}/..`;
       neutrino.options.root = fs.realpathSync(root);
       neutrino.options.source = 'client';
       neutrino.options.mains.index = 'index';

packages/http/src/index.js

@@ -1,17 +1,39 @@
+import {spawn} from 'child_process';
+
 import {createHttpServer} from './server';
 
 // eslint-disable-next-line import/prefer-default-export
 export default {
   hooks: {
     '@latus/core/config': () => ({
+      devPort: 32341,
+      devPublic: undefined,
       host: '0.0.0.0',
       plugins: [],
       port: 32340,
       request: [],
     }),
-    '@latus/core/build': (configs) => {
-      // eslint-disable-next-line global-require, no-param-reassign
-      configs.client = require('./build/.neutrinorc');
+    '@latus/core/build': (configs, {config: {'@latus/http': {devPort, devPublic, host}}}) => {
+      if (process.argv.find((arg) => 'production' === arg)) {
+        // eslint-disable-next-line global-require, no-param-reassign
+        configs.client = require('./build/.neutrinorc');
+      }
+      else {
+        const binary = `$(npm --prefix ${process.cwd()} bin)/webpack-dev-server`;
+        const config = `${__dirname}/build/webpack.config.js`;
+        const options = {
+          env: {
+            ...process.env,
+            HTTP_DEV_HOST: host,
+            HTTP_DEV_PORT: devPort,
+            ...(devPublic ? {HTTP_DEV_PUBLIC: devPublic} : {}),
+          },
+          shell: true,
+          stdio: 'inherit',
+        };
+        process.stdout.write(`${binary} --mode development --config ${config}\n`);
+        spawn(`${binary} --mode development --config ${config}`, options);
+      }
     },
     '@latus/core/up': (latus) => createHttpServer(latus),
     '@latus/http/plugins': (req, {config: {'@latus/http': {'client.up': up}}}) => ({

packages/http/src/server.js

@@ -1,9 +1,10 @@
 import {createReadStream} from 'fs';
-import {createServer} from 'http';
+import {createServer, ServerResponse} from 'http';
 import {join} from 'path';
 
 import {arrayFlatten} from '@latus/core';
 import express from 'express';
+import httpProxy from 'http-proxy';
 
 import latusMiddleware from './latus';
 
@@ -13,7 +14,7 @@ const {
 } = process.env;
 
 export const createHttpServer = async (latus) => {
-  const {config: {'@latus/http': {host, port}}} = latus;
+  const {config: {'@latus/http': {devPort, host, port}}} = latus;
   const app = express();
   const httpServer = createServer(app);
   // eslint-disable-next-line no-param-reassign
@@ -26,9 +27,26 @@ export const createHttpServer = async (latus) => {
   routes.forEach(({method, path, handler}) => app[method](path, handler));
   // Serve latus.
   app.use(latusMiddleware(latus));
-  app.use(express.static(join(__dirname, 'client')));
-  const stream = createReadStream(join(__dirname, 'client', 'index.html'));
-  app.get('*', async (req, res) => stream.pipe(res));
+  // eslint-disable-next-line no-eval
+  if ('production' !== eval('process.env.NODE_ENV')) {
+    const proxy = httpProxy.createProxyServer({
+      secure: false,
+      target: `http://127.0.0.1:${devPort}`,
+    });
+    proxy.on('error', (err, req, res) => {
+      if (res instanceof ServerResponse) {
+        res.status(502).end('Bad Gateway (WDS)');
+      }
+    });
+    app.all('*', (req, res) => proxy.web(req, res));
+    httpServer.on('upgrade', (req, socket, head) => proxy.ws(req, socket, head));
+    httpServer.on('close', () => proxy.close());
+  }
+  else {
+    app.use(express.static(join(__dirname, 'client')));
+    const stream = createReadStream(join(__dirname, 'client', 'index.html'));
+    app.get('*', async (req, res) => stream.pipe(res));
+  }
   return new Promise((resolve, reject) => {
     httpServer.listen(HTTP_PORT || port, HTTP_HOST || host, async (error) => {
       if (error) {