chore(serve): improve dev server types

Author: knagaitsev

packages/serve/src/createConfig.ts

@@ -1,3 +1,5 @@
+import { devServerOptionsType } from './types';
+
 /**
  *
  * Creates a devServer config from CLI args
@@ -6,7 +8,7 @@
  *
  * @returns {Object} valid devServer options object
  */
-export default function createConfig(args): any {
+export default function createConfig(args): devServerOptionsType {
     const options = { ...args };
 
     if (options.clientLogging) {

packages/serve/src/getDevServerOptions.ts

@@ -1,4 +1,5 @@
 import logger from 'webpack-cli/lib/utils/logger';
+import { devServerOptionsType } from './types';
 
 /**
  *
@@ -9,7 +10,7 @@ import logger from 'webpack-cli/lib/utils/logger';
  *
  * @returns {Object}
  */
-export default function getDevServerOptions(compiler, args): any {
+export default function getDevServerOptions(compiler, args): devServerOptionsType[] {
     const defaultOpts = {};
     const devServerOptions = [];
     const compilers = compiler.compilers || [compiler];

packages/serve/src/mergeOptions.ts

@@ -1,12 +1,15 @@
+import { devServerOptionsType } from './types';
+
 /**
  *
  * Merges CLI options and devServer options from config file
  *
- * @param {Object} cliOptions - devServer args
+ * @param {Object} cliOptions - devServer CLI args
+ * @param {Object} devServerOptions - devServer config options
  *
  * @returns {Object} merged options object
  */
-export default function mergeOptions(cliOptions, devServerOptions): any {
+export default function mergeOptions(cliOptions: devServerOptionsType, devServerOptions: devServerOptionsType): devServerOptionsType {
     // CLI options should take precedence over devServer options,
     // and CLI options should have no default values included
     const options = { ...devServerOptions, ...cliOptions };

packages/serve/src/startDevServer.ts

@@ -16,19 +16,21 @@ export default function startDevServer(compiler, args): void {
     const cliOptions = createConfig(args);
     const devServerOptions = getDevServerOptions(compiler, args);
 
-    const usedPorts = [];
+    const usedPorts: number[] = [];
     devServerOptions.forEach((devServerOpts): void => {
         const options = mergeOptions(cliOptions, devServerOpts);
 
         options.host = options.host || 'localhost';
         options.port = options.port || 8080;
 
-        if (usedPorts.find(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 --name flag to specify your desired config.',
             );
         }
-        usedPorts.push(options.port);
+        usedPorts.push(portNum);
 
         const server = new Server(compiler, options);
         server.listen(options.port, options.host, (err): void => {

packages/serve/src/types.ts

@@ -0,0 +1,5 @@
+export type devServerOptionsType = {
+    host?: string;
+    port?: string | number;
+    client?: object;
+};