Hapi 17 (#33)

codeBelt · web-flow · commit e9e8f23696bf · 2018-03-16T00:37:46.000-05:00
* update to Hapi 17

* fix imports
diff --git a/package.json b/package.json
@@ -88,8 +88,8 @@
     "stylelint": "9.1.3",
     "stylelint-config-standard": "18.2.0",
     "stylelint-order": "0.8.1",
-    "webpack-dev-middleware": "1.12.1",
-    "webpack-hot-middleware": "2.20.0",
+    "webpack-dev-middleware": "3.0.1",
+    "webpack-hot-middleware": "2.21.2",
     "webpack-simple-progress-plugin": "0.0.4",
     "write-file-webpack-plugin": "4.2.0"
   },
@@ -100,10 +100,10 @@
     "fetch-everywhere": "1.0.5",
     "form2js": "1.0.0",
     "fs-extra": "5.0.0",
-    "hapi": "16.6.2",
-    "hapi-webpack-plugin": "2.0.0",
+    "hapi": "17.2.2",
+    "hapi-webpack-plugin": "3.0.0",
     "history": "4.7.2",
-    "inert": "4.2.1",
+    "inert": "5.1.0",
     "node-notifier": "5.2.1",
     "react": "16.2.0",
     "react-async-bootstrapper": "1.1.2",
diff --git a/src/server.js b/src/server.js
@@ -1,19 +1,25 @@
 import 'fetch-everywhere';
 import * as inert from 'inert';
-
-import ServerManager from './server/ServerManager';
 import AssetsController from './server/controllers/AssetsController';
-import ReactController from './server/controllers/ReactController';
 import HapiWebpackHotPlugin from './server/plugin/HapiWebpackHotPlugin';
+import ReactController from './server/controllers/ReactController';
+import ServerManager from './server/ServerManager';
+
+(async () => {
+
+    const manager = new ServerManager();
+
+    await manager.registerPlugin(inert);
+
+    if (manager.isDevelopment) {
+        const hapiWebpackHotPlugin = new HapiWebpackHotPlugin();
 
-const manager = new ServerManager();
+        await manager.registerPlugin(hapiWebpackHotPlugin.plugin);
+    }
 
-manager.registerPlugin(inert);
+    manager.registerController(new AssetsController());
+    manager.registerController(new ReactController());
 
-if (manager.isDevelopment) {
-    new HapiWebpackHotPlugin(manager.server); // eslint-disable-line no-new
-}
+    await manager.startServer();
 
-manager.registerController(new AssetsController());
-manager.registerController(new ReactController());
-manager.startServer();
+})();
diff --git a/src/server/ServerManager.js b/src/server/ServerManager.js
@@ -1,26 +1,30 @@
-import * as Hapi from 'hapi';
-
-const PORT = process.env.PORT || 3000;
-const HOST = process.env.HOST || 'localhost';
-const NODE_ENV = process.env.NODE_ENV;
+import Hapi from 'hapi';
 
 class ServerManager {
 
-    static log = () => console.info(`\n\nServer running in ${NODE_ENV} mode at: http://${HOST}:${PORT}\n`);
+    static PORT = parseInt(process.env.PORT, 10) || 3000;
+    static HOST = process.env.HOST || 'localhost';
+    static NODE_ENV = process.env.NODE_ENV;
 
-    _server = new Hapi.Server({debug: {request: ['error']}});
+    isDevelopment = (ServerManager.NODE_ENV === 'development');
 
-    isDevelopment = (NODE_ENV === 'development');
+    _server = null;
 
     get server() {
         return this._server;
     }
 
     constructor() {
-        this._server.connection({
-            host: HOST,
-            port: PORT,
-        });
+        const options = {
+            host: ServerManager.HOST,
+            port: ServerManager.PORT,
+        };
+
+        this._server = new Hapi.Server(options);
+    }
+
+    static log() {
+        console.info(`\n\nServer running in ${ServerManager.NODE_ENV} mode at: http://${ServerManager.HOST}:${ServerManager.PORT}\n`);
     }
 
     async registerPlugin(pluginConfig) {
@@ -31,16 +35,16 @@ class ServerManager {
         controller.mapRoutes(this._server);
     }
 
-    startServer() {
-        this._server.start((error) => {
-            if (error) {
-                throw error;
-            }
+    async startServer() {
+        try {
+            await this._server.start();
 
             if (!this.isDevelopment) {
                 ServerManager.log();
             }
-        });
+        } catch (err) {
+            console.error(err);
+        }
     }
 
 }
diff --git a/src/server/controllers/AssetsController.js b/src/server/controllers/AssetsController.js
@@ -6,8 +6,10 @@ class AssetsController {
         server.route({
             method: 'GET',
             path: '/assets/{file*}',
-            handler: (request, reply) => {
-                reply.file(path.resolve(__dirname, `../../public${request.path}`));
+            handler: (request, h) => {
+                const file = path.resolve(__dirname, `../../public${request.path}`);
+
+                return h.file(file);
             },
         });
     }
diff --git a/src/server/controllers/ReactController.jsx b/src/server/controllers/ReactController.jsx
@@ -3,8 +3,8 @@ import {AsyncComponentProvider, createAsyncContext} from 'react-async-component'
 import asyncBootstrapper from 'react-async-bootstrapper';
 import serialize from 'serialize-javascript';
 import path from 'path';
-import * as fse from 'fs-extra';
-import * as React from 'react';
+import fse from 'fs-extra';
+import React from 'react';
 import RouterWrapper from '../../RouterWrapper';
 import ProviderService from '../../services/ProviderService';
 import rootSaga from '../../stores/rootSaga';
@@ -17,7 +17,7 @@ class ReactController {
         server.route({
             method: 'GET',
             path: '/{route*}',
-            handler: async (request, reply) => {
+            handler: async (request, h) => {
                 const store = ProviderService.createProviderStore({}, null, true);
                 const asyncContext = createAsyncContext();
                 const routeContext = {};
@@ -36,11 +36,19 @@ class ReactController {
 
                 await asyncBootstrapper(app);
 
-                store.runSaga(rootSaga).done.then(() => {
-                    if (routeContext.url) {
-                        return reply().redirect(routeContext.url).permanent().rewritable();
-                    }
+                const sagaDone = store.runSaga(rootSaga).done;
 
+                renderToString(app);
+
+                store.endSaga();
+
+                await sagaDone;
+
+                if (routeContext.url) {
+                    return h.redirect(routeContext.url);
+                }
+
+                try {
                     const renderedHtml = renderToString(app);
                     const asyncComponentsState = asyncContext.getState();
                     const state = store.getState();
@@ -60,14 +68,10 @@ class ReactController {
                         .replace('{state}', JSON.stringify(initialState))
                         .replace('{asyncComponentsState}', serialize(asyncComponentsState));
 
-                    return reply(html);
-                }).catch((error) => {
-                    reply(error.toString());
-                });
-
-                renderToString(app);
-
-                store.endSaga();
+                    return h.response(html);
+                } catch (error) {
+                    return error.toString();
+                }
             },
         });
     }
diff --git a/src/server/plugin/HapiWebpackHotPlugin.js b/src/server/plugin/HapiWebpackHotPlugin.js
@@ -1,35 +1,29 @@
-import Webpack from 'webpack';
-import ServerManager from '../ServerManager';
 import HapiWebpackPlugin from 'hapi-webpack-plugin';
 import notifier from 'node-notifier';
+import Webpack from 'webpack';
+import ServerManager from '../ServerManager';
 
 class HapiWebpackHotPlugin {
 
-    constructor(server) {
+    get plugin() {
         const config = require('../../../webpack.config.js'); // eslint-disable-line global-require
         const compiler = Webpack(config);
 
         compiler.plugin('done', (stats) => this._onDone(stats));
 
-        const options = {
-            assets: {
-                // webpack-dev-middleware options - https://github.com/webpack/webpack-dev-middleware
-                index: '/public/index.html',
-            },
-            hot: {
-                // webpack-hot-middleware options - https://github.com/glenjamin/webpack-hot-middleware
-            },
-            compiler,
+        const assets = {
+            // webpack-dev-middleware options - See https://github.com/webpack/webpack-dev-middleware
+            index: '/public/index.html',
         };
 
-        server.register({
-            register: HapiWebpackPlugin,
-            options,
-        }, (error) => {
-            if (error) {
-                console.error(error);
-            }
-        });
+        const hot = {
+            // webpack-hot-middleware options - See https://github.com/glenjamin/webpack-hot-middleware
+        };
+
+        return {
+            plugin: HapiWebpackPlugin,
+            options: {compiler, assets, hot},
+        };
     }
 
     _onDone(stats) {
diff --git a/yarn.lock b/yarn.lock
