diff --git a/package-lock.json b/package-lock.json
index 43c9b896..70218b1b 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -44,7 +44,6 @@
         "@types/react-helmet": "^6.1.5",
         "@types/react-router-dom": "^5.3.3",
         "@types/styled-components": "^5.1.24",
-        "@types/webpack-dev-server": "^4.7.2",
         "clean-terminal-webpack-plugin": "^3.0.0",
         "css-loader": "^6.7.1",
         "css-minimizer-webpack-plugin": "^5.0.0",
@@ -2022,16 +2021,6 @@
       "resolved": "https://registry.npmjs.org/@types/stylis/-/stylis-4.2.0.tgz",
       "integrity": "sha512-n4sx2bqL0mW1tvDf/loQ+aMX7GQD3lc3fkCMC55VFNDu/vBOabO+LTIeXKM14xK0ppk5TUGcWRjiSpIlUpghKw=="
     },
-    "node_modules/@types/webpack-dev-server": {
-      "version": "4.7.2",
-      "resolved": "https://registry.npmjs.org/@types/webpack-dev-server/-/webpack-dev-server-4.7.2.tgz",
-      "integrity": "sha512-Y3p0Fmfvp0MHBDoCzo+xFJaWTw0/z37mWIo6P15j+OtmUDLvznJWdZNeD7Q004R+MpQlys12oXbXsrXRmxwg4Q==",
-      "deprecated": "This is a stub types definition. webpack-dev-server provides its own type definitions, so you do not need this installed.",
-      "dev": true,
-      "dependencies": {
-        "webpack-dev-server": "*"
-      }
-    },
     "node_modules/@types/ws": {
       "version": "8.5.10",
       "resolved": "https://registry.npmjs.org/@types/ws/-/ws-8.5.10.tgz",
diff --git a/package.json b/package.json
index 525728f1..e49b2e86 100644
--- a/package.json
+++ b/package.json
@@ -71,7 +71,6 @@
     "@types/react-helmet": "^6.1.5",
     "@types/react-router-dom": "^5.3.3",
     "@types/styled-components": "^5.1.24",
-    "@types/webpack-dev-server": "^4.7.2",
     "clean-terminal-webpack-plugin": "^3.0.0",
     "css-loader": "^6.7.1",
     "css-minimizer-webpack-plugin": "^5.0.0",
diff --git a/webpack/devServer.js b/webpack/devServer.js
new file mode 100644
index 00000000..bd289e0c
--- /dev/null
+++ b/webpack/devServer.js
@@ -0,0 +1,23 @@
+/**
+ * @type {import('webpack-dev-server')}
+ */
+module.exports = {
+  port: 9080,
+  compress: false,
+  devMiddleware: {
+    stats: 'errors-warnings',
+  },
+  client: {
+    overlay: false,
+  },
+  historyApiFallback: {
+    rewrites: [
+      {
+        from: /./,
+        to: '/404.html',
+      },
+    ],
+  },
+  hot: true,
+  open: true,
+}
diff --git a/webpack/webpack.config.js b/webpack/webpack.config.js
index 51461a42..937c65d6 100644
--- a/webpack/webpack.config.js
+++ b/webpack/webpack.config.js
@@ -3,6 +3,7 @@ const path = require('path')
 const optimization = require('./optimization')
 const rules = require('./rules')
 const plugins = require('./plugins')
+const devServer = require('./devServer')
 
 const rootDir = process.cwd()
 
@@ -56,28 +57,6 @@ module.exports = env => {
       rules: rules(isDev),
     },
     plugins: plugins(isDev),
-    devServer: /** @type {import('webpack-dev-server')} */ {
-      static: {
-        directory: distDir,
-      },
-      port: 9080,
-      compress: !isDev,
-      devMiddleware: {
-        stats: 'errors-warnings',
-      },
-      client: {
-        overlay: false,
-      },
-      historyApiFallback: {
-        rewrites: [
-          {
-            from: /./,
-            to: '/404.html',
-          },
-        ],
-      },
-      hot: isDev,
-      open: true,
-    },
+    devServer: isDev ? devServer : undefined,
   }
 }