webpack-dev-server 4.5.0 → 4.7.2

package/lib/options.json

@@ -74,7 +74,7 @@
     },
     "ClientLogging": {
       "enum": ["none", "error", "warn", "info", "log", "verbose"],
-      "decription": "Allows to set log level in the browser.",
+      "description": "Allows to set log level in the browser.",
       "link": "https://webpack.js.org/configuration/dev-server/#logging"
     },
     "ClientOverlay": {
@@ -207,7 +207,7 @@
     },
     "HTTP2": {
       "type": "boolean",
-      "description": "Allows to serve over HTTP/2 using SPDY. Deprecated, it will be removed in favor of the `server` option.",
+      "description": "Allows to serve over HTTP/2 using SPDY. Deprecated, use the `server` option.",
       "link": "https://webpack.js.org/configuration/dev-server/#devserverhttp2"
     },
     "HTTPS": {
@@ -221,11 +221,11 @@
           "properties": {
             "passphrase": {
               "type": "string",
-              "description": "Passphrase for a pfx file. Deprecated, it will be removed in favor of the `server.options.passphrase` option."
+              "description": "Passphrase for a pfx file. Deprecated, use the `server.options.passphrase` option."
             },
             "requestCert": {
               "type": "boolean",
-              "description": "Request for an SSL certificate. Deprecated, it will be removed in favor of the `server.options.requestCert` option."
+              "description": "Request for an SSL certificate. Deprecated, use the `server.options.requestCert` option."
             },
             "ca": {
               "anyOf": [
@@ -249,7 +249,7 @@
                   "instanceof": "Buffer"
                 }
               ],
-              "description": "Path to an SSL CA certificate or content of an SSL CA certificate. Deprecated, it will be removed in favor of the `server.options.ca` option."
+              "description": "Path to an SSL CA certificate or content of an SSL CA certificate. Deprecated, use the `server.options.ca` option."
             },
             "cacert": {
               "anyOf": [
@@ -273,7 +273,7 @@
                   "instanceof": "Buffer"
                 }
               ],
-              "description": "Path to an SSL CA certificate or content of an SSL CA certificate. Deprecated, it will be removed in favor of the `server.options.cacert` option."
+              "description": "Path to an SSL CA certificate or content of an SSL CA certificate. Deprecated, use the `server.options.ca` option."
             },
             "cert": {
               "anyOf": [
@@ -297,7 +297,7 @@
                   "instanceof": "Buffer"
                 }
               ],
-              "description": "Path to an SSL certificate or content of an SSL certificate. Deprecated, it will be removed in favor of the `server.options.cert` option."
+              "description": "Path to an SSL certificate or content of an SSL certificate. Deprecated, use the `server.options.cert` option."
             },
             "crl": {
               "anyOf": [
@@ -321,7 +321,7 @@
                   "instanceof": "Buffer"
                 }
               ],
-              "description": "Path to PEM formatted CRLs (Certificate Revocation Lists) or content of PEM formatted CRLs (Certificate Revocation Lists). Deprecated, it will be removed in favor of the `server.options.crl` option."
+              "description": "Path to PEM formatted CRLs (Certificate Revocation Lists) or content of PEM formatted CRLs (Certificate Revocation Lists). Deprecated, use the `server.options.crl` option."
             },
             "key": {
               "anyOf": [
@@ -349,7 +349,7 @@
                   "instanceof": "Buffer"
                 }
               ],
-              "description": "Path to an SSL key or content of an SSL key. Deprecated, it will be removed in favor of the `server.options.key` option."
+              "description": "Path to an SSL key or content of an SSL key. Deprecated, use the `server.options.key` option."
             },
             "pfx": {
               "anyOf": [
@@ -377,12 +377,12 @@
                   "instanceof": "Buffer"
                 }
               ],
-              "description": "Path to an SSL pfx file or content of an SSL pfx file. Deprecated, it will be removed in favor of the `server.options.pfx` option."
+              "description": "Path to an SSL pfx file or content of an SSL pfx file. Deprecated, use the `server.options.pfx` option."
             }
           }
         }
       ],
-      "description": "Allows to configure the server's listening socket for TLS (by default, dev server will be served over HTTP). Deprecated, it will be removed in favor of the `server` option.",
+      "description": "Allows to configure the server's listening socket for TLS (by default, dev server will be served over HTTP). Deprecated, use the `server` option.",
       "link": "https://webpack.js.org/configuration/dev-server/#devserverhttps"
     },
     "HeaderObject": {
@@ -486,12 +486,12 @@
     },
     "OnAfterSetupMiddleware": {
       "instanceof": "Function",
-      "description": "Provides the ability to execute a custom function and apply custom middleware(s) after all other middlewares.",
+      "description": "Provides the ability to execute a custom function and apply custom middleware(s) after all other middlewares. Deprecated: please use the 'setupMiddlewares' option.",
       "link": "https://webpack.js.org/configuration/dev-server/#devserveronaftersetupmiddleware"
     },
     "OnBeforeSetupMiddleware": {
       "instanceof": "Function",
-      "description": "Provides the ability to execute a custom function and apply custom middleware(s) prior to all other middlewares.",
+      "description": "Provides the ability to execute a custom function and apply custom middleware(s) prior to all other middlewares. Deprecated: please use the 'setupMiddlewares' option.",
       "link": "https://webpack.js.org/configuration/dev-server/#devserveronbeforesetupmiddleware"
     },
     "OnListening": {
@@ -580,7 +580,8 @@
             },
             {
               "type": "string",
-              "minLength": 1
+              "minLength": 1,
+              "description": "Open specified browser. Deprecated: please use '--open-app-name'."
             }
           ],
           "description": "Open specified browser."
@@ -666,7 +667,14 @@
       "type": "object",
       "properties": {
         "type": {
-          "$ref": "#/definitions/ServerType"
+          "anyOf": [
+            {
+              "$ref": "#/definitions/ServerType"
+            },
+            {
+              "$ref": "#/definitions/ServerString"
+            }
+          ]
         },
         "options": {
           "$ref": "#/definitions/ServerOptions"
@@ -732,7 +740,7 @@
               "instanceof": "Buffer"
             }
           ],
-          "description": "Path to an SSL CA certificate or content of an SSL CA certificate."
+          "description": "Path to an SSL CA certificate or content of an SSL CA certificate. Deprecated, use the `server.options.ca` option."
         },
         "cert": {
           "anyOf": [
@@ -848,6 +856,11 @@
         "exclude": true
       }
     },
+    "SetupMiddlewares": {
+      "instanceof": "Function",
+      "description": "Provides the ability to execute a custom function and apply custom middleware(s).",
+      "link": "https://webpack.js.org/configuration/dev-server/#devserversetupmiddlewares"
+    },
     "Static": {
       "anyOf": [
         {
@@ -984,10 +997,13 @@
               "type": "string",
               "minLength": 1
             }
-          ]
+          ],
+          "description": "Path(s) of globs/directories/files to watch for file changes."
         },
         "options": {
           "type": "object",
+          "description": "Configure advanced options for watching. See the chokidar documentation for the possible options.",
+          "link": "https://github.com/paulmillr/chokidar#api",
           "additionalProperties": true
         }
       },
@@ -1027,7 +1043,7 @@
           "$ref": "#/definitions/WebSocketServerType"
         }
       ],
-      "description": "Deprecated: please use 'webSocketServer.type'/'--web-socket-server-type' option."
+      "description": "Deprecated: please use '--web-socket-server-type' option."
     },
     "WebSocketServerFunction": {
       "instanceof": "Function"
@@ -1131,6 +1147,9 @@
     "setupExitSignals": {
       "$ref": "#/definitions/SetupExitSignals"
     },
+    "setupMiddlewares": {
+      "$ref": "#/definitions/SetupMiddlewares"
+    },
     "static": {
       "$ref": "#/definitions/Static"
     },

package/lib/servers/BaseServer.js

@@ -1,10 +1,18 @@
 "use strict";
 
+/** @typedef {import("../Server").ClientConnection} ClientConnection */
+
 // base class that users should extend if they are making their own
 // server implementation
 module.exports = class BaseServer {
+  /**
+   * @param {import("../Server")} server
+   */
   constructor(server) {
+    /** @type {import("../Server")} */
     this.server = server;
+
+    /** @type {ClientConnection[]} */
     this.clients = [];
   }
 };

package/lib/servers/SockJSServer.js

@@ -1,18 +1,22 @@
 "use strict";
 
-/* eslint-disable
-  class-methods-use-this
-*/
 const sockjs = require("sockjs");
 const BaseServer = require("./BaseServer");
 
+/** @typedef {import("../Server").WebSocketServerConfiguration} WebSocketServerConfiguration */
+/** @typedef {import("../Server").ClientConnection} ClientConnection */
+
 // Workaround for sockjs@~0.3.19
 // sockjs will remove Origin header, however Origin header is required for checking host.
 // See https://github.com/webpack/webpack-dev-server/issues/1604 for more information
 {
+  // @ts-ignore
   const SockjsSession = require("sockjs/lib/transport").Session;
   const decorateConnection = SockjsSession.prototype.decorateConnection;
 
+  /**
+   * @param {import("http").IncomingMessage} req
+   */
   // eslint-disable-next-line func-names
   SockjsSession.prototype.decorateConnection = function (req) {
     decorateConnection.call(this, req);
@@ -31,6 +35,9 @@ const BaseServer = require("./BaseServer");
 
 module.exports = class SockJSServer extends BaseServer {
   // options has: error (function), debug (function), server (http/s server), path (string)
+  /**
+   * @param {import("../Server")} server
+   */
   constructor(server) {
     super(server);
 
@@ -38,6 +45,10 @@ module.exports = class SockJSServer extends BaseServer {
       // Use provided up-to-date sockjs-client
       sockjs_url: "/__webpack_dev_server__/sockjs.bundle.js",
       // Default logger is very annoy. Limit useless logs.
+      /**
+       * @param {string} severity
+       * @param {string} line
+       */
       log: (severity, line) => {
         if (severity === "error") {
           this.server.logger.error(line);
@@ -49,6 +60,10 @@ module.exports = class SockJSServer extends BaseServer {
       },
     });
 
+    /**
+     * @param {import("sockjs").ServerOptions & { path?: string }} options
+     * @returns {string | undefined}
+     */
     const getPrefix = (options) => {
       if (typeof options.prefix !== "undefined") {
         return options.prefix;
@@ -57,23 +72,41 @@ module.exports = class SockJSServer extends BaseServer {
       return options.path;
     };
 
-    this.implementation.installHandlers(this.server.server, {
-      ...this.server.options.webSocketServer.options,
-      prefix: getPrefix(this.server.options.webSocketServer.options),
-    });
+    const options = {
+      .../** @type {WebSocketServerConfiguration} */
+      (this.server.options.webSocketServer).options,
+      prefix: getPrefix(
+        /** @type {NonNullable<WebSocketServerConfiguration["options"]>} */
+        (
+          /** @type {WebSocketServerConfiguration} */
+          (this.server.options.webSocketServer).options
+        )
+      ),
+    };
+
+    this.implementation.installHandlers(
+      /** @type {import("http").Server} */ (this.server.server),
+      options
+    );
 
     this.implementation.on("connection", (client) => {
+      // @ts-ignore
       // Implement the the same API as for `ws`
       client.send = client.write;
+      // @ts-ignore
       client.terminate = client.close;
 
-      this.clients.push(client);
+      this.clients.push(/** @type {ClientConnection} */ (client));
 
       client.on("close", () => {
-        this.clients.splice(this.clients.indexOf(client), 1);
+        this.clients.splice(
+          this.clients.indexOf(/** @type {ClientConnection} */ (client)),
+          1
+        );
       });
     });
 
+    // @ts-ignore
     this.implementation.close = (callback) => {
       callback();
     };

package/lib/servers/WebsocketServer.js

@@ -1,19 +1,24 @@
 "use strict";
 
-/* eslint-disable
-  class-methods-use-this
-*/
 const WebSocket = require("ws");
 const BaseServer = require("./BaseServer");
 
+/** @typedef {import("../Server").WebSocketServerConfiguration} WebSocketServerConfiguration */
+/** @typedef {import("../Server").ClientConnection} ClientConnection */
+
 module.exports = class WebsocketServer extends BaseServer {
   static heartbeatInterval = 1000;
 
+  /**
+   * @param {import("../Server")} server
+   */
   constructor(server) {
     super(server);
 
+    /** @type {import("ws").ServerOptions} */
     const options = {
-      ...this.server.options.webSocketServer.options,
+      .../** @type {WebSocketServerConfiguration} */
+      (this.server.options.webSocketServer).options,
       clientTracking: false,
     };
     const isNoServerMode =
@@ -26,46 +31,72 @@ module.exports = class WebsocketServer extends BaseServer {
 
     this.implementation = new WebSocket.Server(options);
 
-    this.server.server.on("upgrade", (req, sock, head) => {
-      if (!this.implementation.shouldHandle(req)) {
-        return;
-      }
-
-      this.implementation.handleUpgrade(req, sock, head, (connection) => {
-        this.implementation.emit("connection", connection, req);
-      });
-    });
+    /** @type {import("http").Server} */
+    (this.server.server).on(
+      "upgrade",
+      /**
+       * @param {import("http").IncomingMessage} req
+       * @param {import("stream").Duplex} sock
+       * @param {Buffer} head
+       */
+      (req, sock, head) => {
+        if (!this.implementation.shouldHandle(req)) {
+          return;
+        }
 
-    this.implementation.on("error", (err) => {
-      this.server.logger.error(err.message);
-    });
+        this.implementation.handleUpgrade(req, sock, head, (connection) => {
+          this.implementation.emit("connection", connection, req);
+        });
+      }
+    );
+
+    this.implementation.on(
+      "error",
+      /**
+       * @param {Error} err
+       */
+      (err) => {
+        this.server.logger.error(err.message);
+      }
+    );
 
     const interval = setInterval(() => {
-      this.clients.forEach((client) => {
-        if (client.isAlive === false) {
-          client.terminate();
-
-          return;
+      this.clients.forEach(
+        /**
+         * @param {ClientConnection} client
+         */
+        (client) => {
+          if (client.isAlive === false) {
+            client.terminate();
+
+            return;
+          }
+
+          client.isAlive = false;
+          client.ping(() => {});
         }
-
-        client.isAlive = false;
-        client.ping(() => {});
-      });
+      );
     }, WebsocketServer.heartbeatInterval);
 
-    this.implementation.on("connection", (client) => {
-      this.clients.push(client);
+    this.implementation.on(
+      "connection",
+      /**
+       * @param {ClientConnection} client
+       */
+      (client) => {
+        this.clients.push(client);
 
-      client.isAlive = true;
-
-      client.on("pong", () => {
         client.isAlive = true;
-      });
 
-      client.on("close", () => {
-        this.clients.splice(this.clients.indexOf(client), 1);
-      });
-    });
+        client.on("pong", () => {
+          client.isAlive = true;
+        });
+
+        client.on("close", () => {
+          this.clients.splice(this.clients.indexOf(client), 1);
+        });
+      }
+    );
 
     this.implementation.on("close", () => {
       clearInterval(interval);

package/package.json

@@ -1,13 +1,15 @@
 {
   "name": "webpack-dev-server",
-  "version": "4.5.0",
+  "version": "4.7.2",
   "description": "Serves a webpack app. Updates the browser on changes.",
   "bin": "bin/webpack-dev-server.js",
   "main": "lib/Server.js",
+  "types": "types/lib/Server.d.ts",
   "files": [
     "bin",
     "lib",
-    "client"
+    "client",
+    "types"
   ],
   "engines": {
     "node": ">= 12.13.0"
@@ -15,14 +17,15 @@
   "scripts": {
     "fmt:check": "prettier \"{**/*,*}.{js,json,md,yml,css,ts}\" --list-different",
     "lint:js": "eslint . --cache",
-    "lint:type": "tsc --noEmit",
-    "lint": "npm-run-all lint:js lint:type fmt:check",
+    "lint:types": "tsc --pretty --noEmit",
+    "lint": "npm-run-all -p \"fmt:**\" \"lint:**\"",
     "fmt": "npm run fmt:check -- --write",
     "fix:js": "npm run lint:js -- --fix",
     "fix": "npm-run-all fix:js fmt",
     "commitlint": "commitlint --from=master",
-    "build": "npm-run-all build:client",
     "build:client": "rimraf ./client/* && babel client-src/ --out-dir client/ --ignore \"client-src/webpack.config.js\" --ignore \"client-src/modules\" && webpack --config client-src/webpack.config.js",
+    "build:types": "rimraf ./types/* && tsc --declaration --emitDeclarationOnly --outDir types && node ./scripts/extend-webpack-types.js && prettier \"types/**/*.ts\" --write && prettier \"types/**/*.ts\" --write",
+    "build": "npm-run-all -p \"build:**\"",
     "test:only": "jest",
     "test:coverage": "npm run test:only -- --coverage",
     "test:watch": "npm run test:coverage --watch",
@@ -32,30 +35,34 @@
     "release": "standard-version"
   },
   "dependencies": {
+    "@types/bonjour": "^3.5.9",
+    "@types/connect-history-api-fallback": "^1.3.5",
+    "@types/serve-index": "^1.9.1",
+    "@types/sockjs": "^0.3.33",
+    "@types/ws": "^8.2.2",
     "ansi-html-community": "^0.0.8",
     "bonjour": "^3.5.0",
     "chokidar": "^3.5.2",
     "colorette": "^2.0.10",
     "compression": "^1.7.4",
     "connect-history-api-fallback": "^1.6.0",
+    "default-gateway": "^6.0.3",
     "del": "^6.0.0",
     "express": "^4.17.1",
     "graceful-fs": "^4.2.6",
     "html-entities": "^2.3.2",
     "http-proxy-middleware": "^2.0.0",
-    "internal-ip": "^6.2.0",
     "ipaddr.js": "^2.0.1",
     "open": "^8.0.9",
     "p-retry": "^4.5.0",
     "portfinder": "^1.0.28",
-    "schema-utils": "^3.1.0",
+    "schema-utils": "^4.0.0",
     "selfsigned": "^1.10.11",
     "serve-index": "^1.9.1",
     "sockjs": "^0.3.21",
     "spdy": "^4.0.2",
     "strip-ansi": "^7.0.0",
-    "url": "^0.11.0",
-    "webpack-dev-middleware": "^5.2.1",
+    "webpack-dev-middleware": "^5.3.0",
     "ws": "^8.1.0"
   },
   "devDependencies": {
@@ -66,16 +73,17 @@
     "@babel/plugin-transform-runtime": "^7.14.5",
     "@babel/preset-env": "^7.14.5",
     "@babel/runtime": "^7.14.5",
-    "@commitlint/cli": "^14.1.0",
-    "@commitlint/config-conventional": "^14.1.0",
+    "@commitlint/cli": "^16.0.1",
+    "@commitlint/config-conventional": "^16.0.0",
+    "@types/compression": "^1.7.2",
+    "@types/default-gateway": "^3.0.1",
+    "@types/sockjs-client": "^1.5.1",
     "acorn": "^8.2.4",
-    "babel-jest": "^27.0.2",
+    "babel-jest": "^27.4.4",
     "babel-loader": "^8.2.2",
-    "body-parser": "^1.19.0",
+    "body-parser": "^1.19.1",
     "core-js": "^3.12.1",
     "css-loader": "^5.2.4",
-    "css-tree": "^1.1.3",
-    "csstree": "^0.0.3",
     "eslint": "^8.0.1",
     "eslint-config-prettier": "^8.3.0",
     "eslint-config-webpack": "^1.2.5",
@@ -85,16 +93,16 @@
     "html-webpack-plugin": "^4.5.2",
     "http-proxy": "^1.18.1",
     "husky": "^7.0.0",
-    "jest": "^27.0.4",
+    "jest": "^27.4.4",
     "klona": "^2.0.4",
     "less": "^4.1.1",
     "less-loader": "^7.3.0",
-    "lint-staged": "^11.0.0",
+    "lint-staged": "^12.0.2",
     "marked": "^3.0.0",
     "memfs": "^3.2.2",
     "npm-run-all": "^4.1.5",
     "prettier": "^2.3.1",
-    "puppeteer": "^10.0.0",
+    "puppeteer": "^13.0.0",
     "require-from-string": "^2.0.2",
     "rimraf": "^3.0.2",
     "sockjs-client": "^1.5.1",