diff --git a/config/webpack.config.js b/config/webpack.config.js
index c0ecce5..8761648 100644
--- a/config/webpack.config.js
+++ b/config/webpack.config.js
@@ -80,11 +80,11 @@ const hasJsxRuntime = (() => {
 
 // This is the production and development configuration.
 // It is focused on developer experience, fast rebuilds, and a minimal bundle.
-module.exports = function (webpackEnv) {
+module.exports = function (webpackEnv, isServerDEV) {
   const isEnvDevelopment = webpackEnv === 'development';
   const isEnvProduction = webpackEnv === 'production' ;
   const isEnvServer = webpackEnv === 'server';
-  const isServerDEV =process.env.SERVER_DEV === "true" 
+  isServerDEV = typeof isServerDEV !=undefined ? isServerDEV : process.env.SERVER_DEV === "true"  
   console.info(isServerDEV)
 
   const isProdOrServer = isEnvProduction || isEnvServer
@@ -429,7 +429,11 @@ module.exports = function (webpackEnv) {
                 ),
                 presets: [
                   [
-                    require.resolve('babel-preset-react-app'),
+                     isEnvDevelopment 
+                     ? require.resolve('babel-preset-react-app')
+                     : isServerDEV 
+                      ?  require.resolve('babel-preset-react-app/server')
+                      : require.resolve('babel-preset-react-app'),
                     {
                       runtime: hasJsxRuntime ? 'automatic' : 'classic',
                     },
diff --git a/package-lock.json b/package-lock.json
index 4b41054..0133390 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -7727,6 +7727,15 @@
         }
       }
     },
+    "html-webpack-skip-assets-plugin": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/html-webpack-skip-assets-plugin/-/html-webpack-skip-assets-plugin-1.0.1.tgz",
+      "integrity": "sha512-Ha7RkuihcG0e1w4gGsJJ6uRyPtiRmfoSH+SA9GiIywjUa8P8JioTUGGvzuIXFvUD05cASCrQY7VsAnwKfTzylA==",
+      "dev": true,
+      "requires": {
+        "minimatch": "3.0.4"
+      }
+    },
     "htmlparser2": {
       "version": "3.10.1",
       "resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-3.10.1.tgz",
@@ -12697,6 +12706,16 @@
         "uniq": "^1.0.1"
       }
     },
+    "preload-webpack-plugin": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/preload-webpack-plugin/-/preload-webpack-plugin-2.3.0.tgz",
+      "integrity": "sha512-TWpYf7QqmW9lxXIQcPAPkfO+G6Zf/WrSZtqx864IdUtqZ+QGESfOGbGSMlBBt96sYEE+cZLF2GLrxbmLyieX6g==",
+      "dev": true,
+      "requires": {
+        "object-assign": "^4.1.1",
+        "object.values": "^1.0.4"
+      }
+    },
     "prelude-ls": {
       "version": "1.2.1",
       "resolved": "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.2.1.tgz",
diff --git a/patches/babel-preset-react-app+10.0.0.patch b/patches/babel-preset-react-app+10.0.0.patch
index 1d5f76d..93ab096 100644
--- a/patches/babel-preset-react-app+10.0.0.patch
+++ b/patches/babel-preset-react-app+10.0.0.patch
@@ -1,5 +1,5 @@
 diff --git a/node_modules/babel-preset-react-app/create.js b/node_modules/babel-preset-react-app/create.js
-index 99a930b..cc1f268 100644
+index 99a930b..5173263 100644
 --- a/node_modules/babel-preset-react-app/create.js
 +++ b/node_modules/babel-preset-react-app/create.js
 @@ -27,12 +27,14 @@ module.exports = function (api, opts, env) {
@@ -334,7 +334,6 @@ index 99a930b..cc1f268 100644
 +
 +  return res
  };
-\ No newline at end of file
 diff --git a/node_modules/babel-preset-react-app/dependencies.js b/node_modules/babel-preset-react-app/dependencies.js
 index acbd65a..828d1f7 100644
 --- a/node_modules/babel-preset-react-app/dependencies.js
@@ -377,3 +376,23 @@ index acbd65a..828d1f7 100644
            // Undocumented option that lets us encapsulate our runtime, ensuring
            // the correct version is used
            // https://github.com/babel/babel/blob/090c364a90fe73d36a30707fc612ce037bdbbb24/packages/babel-plugin-transform-runtime/src/index.js#L35-L42
+diff --git a/node_modules/babel-preset-react-app/server.js b/node_modules/babel-preset-react-app/server.js
+new file mode 100644
+index 0000000..322c4fe
+--- /dev/null
++++ b/node_modules/babel-preset-react-app/server.js
+@@ -0,0 +1,14 @@
++/**
++ * Copyright (c) 2015-present, Facebook, Inc.
++ *
++ * This source code is licensed under the MIT license found in the
++ * LICENSE file in the root directory of this source tree.
++ */
++'use strict';
++
++const create = require('babel-preset-react-app/create');
++
++module.exports = function (api, opts) {
++  
++  return create(api, opts, "server");
++};
diff --git a/patches/react-dev-utils+11.0.1.patch b/patches/react-dev-utils+11.0.1.patch
new file mode 100644
index 0000000..c9c3da8
--- /dev/null
+++ b/patches/react-dev-utils+11.0.1.patch
@@ -0,0 +1,62 @@
+diff --git a/node_modules/react-dev-utils/WebpackDevServerUtils.js b/node_modules/react-dev-utils/WebpackDevServerUtils.js
+index 6a56f66..ae1c007 100644
+--- a/node_modules/react-dev-utils/WebpackDevServerUtils.js
++++ b/node_modules/react-dev-utils/WebpackDevServerUtils.js
+@@ -140,13 +140,15 @@ function createCompiler({
+   let tsMessagesResolver;
+ 
+   if (useTypeScript) {
+-    compiler.hooks.beforeCompile.tap('beforeCompile', () => {
+-      tsMessagesPromise = new Promise(resolve => {
+-        tsMessagesResolver = msgs => resolve(msgs);
++
++    compiler.compilers.forEach(compiler=>{
++      compiler.hooks.beforeCompile.tap('beforeCompile', () => {
++        tsMessagesPromise = new Promise(resolve => {
++          tsMessagesResolver = msgs => resolve(msgs);
++        });
+       });
+-    });
+ 
+-    forkTsCheckerWebpackPlugin
++      forkTsCheckerWebpackPlugin
+       .getCompilerHooks(compiler)
+       .receive.tap('afterTypeScriptCheck', (diagnostics, lints) => {
+         const allMsgs = [...diagnostics, ...lints];
+@@ -160,6 +162,8 @@ function createCompiler({
+             .map(format),
+         });
+       });
++
++    })
+   }
+ 
+   // "done" event fires when webpack has finished recompiling the bundle.
+@@ -168,6 +172,7 @@ function createCompiler({
+     if (isInteractive) {
+       clearConsole();
+     }
++    const multiStats= [...stats.stats || stats]
+ 
+     // We have switched off the default webpack output in WebpackDevServer
+     // options so we are going to "massage" the warnings and errors and present
+@@ -201,11 +206,17 @@ function createCompiler({
+       // Push errors and warnings into compilation result
+       // to show them after page refresh triggered by user.
+       if (tscCompileOnError) {
+-        stats.compilation.warnings.push(...messages.errors);
++        multiStats.forEach(stats =>  { 
++          stats.compilation.warnings.push(...messages.errors)
++        })
+       } else {
++        multiStats.forEach(stats =>  {
+         stats.compilation.errors.push(...messages.errors);
++        })
+       }
+-      stats.compilation.warnings.push(...messages.warnings);
++      multiStats.forEach(stats =>  {
++        stats.compilation.warnings.push(...messages.warnings);
++      })
+ 
+       if (messages.errors.length > 0) {
+         if (tscCompileOnError) {
diff --git a/scripts/start.js b/scripts/start.js
index aaa1993..b238374 100644
--- a/scripts/start.js
+++ b/scripts/start.js
@@ -80,7 +80,7 @@ checkBrowsers(paths.appPath, isInteractive)
       return;
     }
 
-    const config = configFactory('development');
+    const config = [configFactory('development'), configFactory("server", true)];
     const protocol = process.env.HTTPS === 'true' ? 'https' : 'http';
     const appName = require(paths.appPackageJson).name;
 
diff --git a/scripts/startServer.js b/scripts/startServer.js
index 102a010..b7c65f6 100644
--- a/scripts/startServer.js
+++ b/scripts/startServer.js
@@ -80,7 +80,7 @@ checkBrowsers(paths.appPath, isInteractive)
       return;
     }
 
-    const config = configFactory('server');
+    const config = [configFactory('server', true)];
     const protocol = process.env.HTTPS === 'true' ? 'https' : 'http';
     const appName = require(paths.appPackageJson).name;