implements connect-history-api-fallback and refines the way client files are served

src/index.js

@@ -3,6 +3,7 @@ require('isomorphic-fetch');
 
 const path = require('path');
 const express = require('express');
+const history = require('connect-history-api-fallback');
 const graphQLPlayground = require('graphql-playground-middleware-express').default;
 const getConfig = require('./utilities/getConfig');
 const authenticate = require('./express/middleware/authenticate');
@@ -55,8 +56,10 @@ class Payload {
 
     // Initialize Admin panel
     if (!this.config.admin.disable && process.env.NODE_ENV !== 'test') {
+      this.express.use(`${this.config.routes.admin}`, history());
+
       if (process.env.NODE_ENV === 'production') {
-        this.express.use(this.config.routes.admin, express.static(path.resolve(process.cwd(), 'build')));
+        this.express.use(`${this.config.routes.admin}`, express.static(path.resolve(process.cwd(), 'build')));
       } else {
         this.express.use(this.initWebpack());
       }

src/webpack/getWebpackDevConfig.js

@@ -14,7 +14,7 @@ module.exports = (config) => {
     },
     output: {
       path: '/',
-      publicPath: '/static',
+      publicPath: config.routes.admin,
       filename: '[name].js',
     },
     devServer: {

src/webpack/init.js

@@ -16,15 +16,6 @@ function initWebpack() {
 
   router.use(webpackHotMiddleware(compiler));
 
-  router.get(`${this.config.routes.admin}*`, (req, res, next) => {
-    compiler.outputFileSystem.readFile('/index.html', (err, result) => {
-      if (err) {
-        return next(err);
-      }
-      return res.set('content-type', 'text/html').send(result);
-    });
-  });
-
   return router;
 }