From 7bf9f819e0f207d9d39f1205c0ab3ab6fc084ff4 Mon Sep 17 00:00:00 2001
From: soupette <cyril@strapi.io>
Date: Mon, 17 Jan 2022 12:05:45 +0100
Subject: [PATCH] Fixes #11936

Signed-off-by: soupette <cyril@strapi.io>
---
 packages/core/admin/index.js | 58 ++++++++++++++++++++----------------
 1 file changed, 32 insertions(+), 26 deletions(-)

diff --git a/packages/core/admin/index.js b/packages/core/admin/index.js
index 74596ca62c..498898251a 100644
--- a/packages/core/admin/index.js
+++ b/packages/core/admin/index.js
@@ -29,6 +29,11 @@ function getCustomWebpackConfig(dir, config) {
     const webpackAdminConfig = require(path.resolve(adminConfigPath));
 
     if (_.isFunction(webpackAdminConfig)) {
+      // Expose the devServer configuration
+      if (config.devServer) {
+        webpackConfig.devServer = config.devServer;
+      }
+
       webpackConfig = webpackAdminConfig(webpackConfig, webpack);
 
       if (!webpackConfig) {
@@ -232,41 +237,42 @@ async function watchAdmin({ plugins, dir, host, port, browser, options }) {
     port,
     options,
     roots,
+    devServer: {
+      port,
+      client: {
+        logging: 'none',
+        overlay: {
+          errors: true,
+          warnings: false,
+        },
+      },
+
+      open: browser === 'true' ? true : browser,
+      devMiddleware: {
+        publicPath: options.adminPath,
+      },
+      historyApiFallback: {
+        index: options.adminPath,
+        disableDotRule: true,
+      },
+    },
   };
 
   const webpackConfig = getCustomWebpackConfig(dir, args);
-  const opts = {
-    client: {
-      logging: 'none',
-      overlay: {
-        errors: true,
-        warnings: false,
-      },
-    },
 
-    open: browser === 'true' ? true : browser,
-    devMiddleware: {
-      publicPath: options.adminPath,
-    },
-    historyApiFallback: {
-      index: options.adminPath,
-      disableDotRule: true,
-    },
+  const compiler = webpack(webpackConfig);
 
-    ...webpack(webpackConfig).options.devServer,
-  };
-
-  const server = new WebpackDevServer(opts, webpack(webpackConfig));
-
-  server.start(port, host, function(err) {
-    if (err) {
-      console.log(err);
-    }
+  const server = new WebpackDevServer(compiler.options.devServer, compiler);
 
+  const runServer = async () => {
     console.log(chalk.green('Starting the development server...'));
     console.log();
     console.log(chalk.green(`Admin development at http://${host}:${port}${options.adminPath}`));
-  });
+
+    await server.start();
+  };
+
+  runServer();
 
   watchFiles(dir);
 }