diff --git a/packages/serve/__tests__/createConfig.test.ts b/packages/serve/__tests__/createConfig.test.ts
index 96a08c483e0..199df84b4a1 100644
--- a/packages/serve/__tests__/createConfig.test.ts
+++ b/packages/serve/__tests__/createConfig.test.ts
@@ -8,14 +8,14 @@ describe('createConfig', () => {
             hot: true,
             openPage: 'main',
         };
-        expect(createConfig(args)).toEqual(args);
+        expect(createConfig(args, false)).toEqual(args);
     });
 
     it('sets client object using clientLogging argument', () => {
         const args = {
             clientLogging: 'verbose',
         };
-        expect(createConfig(args)).toEqual({
+        expect(createConfig(args, false)).toEqual({
             client: {
                 logging: 'verbose',
             },
@@ -26,17 +26,26 @@ describe('createConfig', () => {
         const args = {
             hotOnly: true,
         };
-        expect(createConfig(args)).toEqual({
+        expect(createConfig(args, false)).toEqual({
             hotOnly: true,
         });
     });
 
+    it('sets hot using hotOnly argument with devServer 4', () => {
+        const args = {
+            hotOnly: true,
+        };
+        expect(createConfig(args, true)).toEqual({
+            hot: 'only',
+        });
+    });
+
     it('overrides hot with hotOnly', () => {
         const args = {
             hot: true,
             hotOnly: true,
         };
-        expect(createConfig(args)).toEqual({
+        expect(createConfig(args, false)).toEqual({
             hot: true,
             hotOnly: true,
         });
diff --git a/packages/serve/src/createConfig.ts b/packages/serve/src/createConfig.ts
index 94571608122..0c60ccf6099 100644
--- a/packages/serve/src/createConfig.ts
+++ b/packages/serve/src/createConfig.ts
@@ -1,29 +1,16 @@
-import { utils } from 'webpack-cli';
-
 import { devServerOptionsType } from './types';
 
-const { logger } = utils;
-
 /**
  *
  * Creates a devServer config from CLI args
  *
  * @param {Object} args - devServer args
+ * @param {boolean} isDevServer4 - is devServer v4
  *
  * @returns {Object} valid devServer options object
  */
-export default function createConfig(args): devServerOptionsType {
+export default function createConfig(args, isDevServer4): devServerOptionsType {
     const options = { ...args };
-    let isDevServer4 = false,
-        devServerVersion;
-    try {
-        // eslint-disable-next-line node/no-extraneous-require
-        devServerVersion = require('webpack-dev-server/package.json').version;
-    } catch (err) {
-        logger.error(`You need to install 'webpack-dev-server' for running 'webpack serve'.\n${err}`);
-        process.exit(2);
-    }
-    isDevServer4 = devServerVersion.startsWith('4');
 
     if (options.clientLogging) {
         options.client = {
diff --git a/packages/serve/src/startDevServer.ts b/packages/serve/src/startDevServer.ts
index 74ebc208b43..945f74a45a1 100644
--- a/packages/serve/src/startDevServer.ts
+++ b/packages/serve/src/startDevServer.ts
@@ -16,15 +16,21 @@ const { logger } = utils;
  * @returns {Object[]} array of resulting servers
  */
 export default function startDevServer(compiler, devServerArgs): object[] {
-    let Server;
+    let isDevServer4 = false,
+        devServerVersion,
+        Server;
     try {
+        // eslint-disable-next-line node/no-extraneous-require
+        devServerVersion = require('webpack-dev-server/package.json').version;
         // eslint-disable-next-line node/no-extraneous-require
         Server = require('webpack-dev-server/lib/Server');
     } catch (err) {
         logger.error(`You need to install 'webpack-dev-server' for running 'webpack serve'.\n${err}`);
         process.exit(2);
     }
-    const cliOptions = createConfig(devServerArgs);
+    isDevServer4 = devServerVersion.startsWith('4');
+
+    const cliOptions = createConfig(devServerArgs, isDevServer4);
     const devServerOptions = getDevServerOptions(compiler);
 
     const servers = [];
@@ -33,16 +39,21 @@ export default function startDevServer(compiler, devServerArgs): object[] {
     devServerOptions.forEach((devServerOpts): void => {
         const options = mergeOptions(cliOptions, devServerOpts);
         options.host = options.host || 'localhost';
-        options.port = options.port || 8080;
+        // devSever v4 handles the default port itself
+        if (!isDevServer4) {
+            options.port = options.port || 8080;
+        }
 
-        const portNum = +options.port;
+        if (options.port) {
+            const portNum = +options.port;
 
-        if (usedPorts.find((port) => portNum === port)) {
-            throw new Error(
-                'Unique ports must be specified for each devServer option in your webpack configuration. Alternatively, run only 1 devServer config using the --config-name flag to specify your desired config.',
-            );
+            if (usedPorts.find((port) => portNum === port)) {
+                throw new Error(
+                    'Unique ports must be specified for each devServer option in your webpack configuration. Alternatively, run only 1 devServer config using the --config-name flag to specify your desired config.',
+                );
+            }
+            usedPorts.push(portNum);
         }
-        usedPorts.push(portNum);
 
         const server = new Server(compiler, options);
         server.listen(options.port, options.host, (err): void => {