webpack-dev-server 4.0.0-rc.0 → 4.1.1

package/lib/options.json

@@ -71,12 +71,14 @@
     },
     "ClientLogging": {
       "enum": ["none", "error", "warn", "info", "log", "verbose"],
-      "decription": "Allows to set log level in the browser."
+      "decription": "Allows to set log level in the browser.",
+      "link": "https://webpack.js.org/configuration/dev-server/#logging"
     },
     "ClientOverlay": {
       "anyOf": [
         {
           "description": "Enables a full-screen overlay in the browser when there are compiler errors or warnings.",
+          "link": "https://webpack.js.org/configuration/dev-server/#overlay",
           "type": "boolean"
         },
         {
@@ -97,6 +99,7 @@
     },
     "ClientProgress": {
       "description": "Prints compilation progress in percentage in the browser.",
+      "link": "https://webpack.js.org/configuration/dev-server/#progress",
       "type": "boolean"
     },
     "ClientWebSocketTransport": {
@@ -108,7 +111,8 @@
           "$ref": "#/definitions/ClientWebSocketTransportString"
         }
       ],
-      "description": "Allows to set custom web socket transport to communicate with dev server."
+      "description": "Allows to set custom web socket transport to communicate with dev server.",
+      "link": "https://webpack.js.org/configuration/dev-server/#websockettransport"
     },
     "ClientWebSocketTransportEnum": {
       "enum": ["sockjs", "ws"]
@@ -119,6 +123,7 @@
     },
     "ClientWebSocketURL": {
       "description": "Allows to specify URL to web socket server (useful when you're proxying dev server and client script does not always know where to connect to).",
+      "link": "https://webpack.js.org/configuration/dev-server/#websocketurl",
       "anyOf": [
         {
           "type": "string",
@@ -283,10 +288,17 @@
       "link": "https://webpack.js.org/configuration/dev-server/#devserverhistoryapifallback"
     },
     "Host": {
-      "type": "string",
-      "minLength": 1,
       "description": "Allows to specify a hostname to use.",
-      "link": "https://webpack.js.org/configuration/dev-server/#devserverhost"
+      "link": "https://webpack.js.org/configuration/dev-server/#devserverhost",
+      "anyOf": [
+        {
+          "enum": ["local-ip", "local-ipv4", "local-ipv6"]
+        },
+        {
+          "type": "string",
+          "minLength": 1
+        }
+      ]
     },
     "Hot": {
       "anyOf": [
@@ -319,6 +331,11 @@
       "description": "Enables reload/refresh the page(s) when file changes are detected (enabled by default).",
       "link": "https://webpack.js.org/configuration/dev-server/#devserverlivereload"
     },
+    "MagicHTML": {
+      "type": "boolean",
+      "description": "Tells dev-server whether to enable magic HTML routes (routes corresponding to your webpack output, for example '/main' for 'main.js').",
+      "link": "https://webpack.js.org/configuration/dev-server/#devservermagichtml"
+    },
     "OnAfterSetupMiddleware": {
       "instanceof": "Function",
       "description": "Provides the ability to execute a custom function and apply custom middleware(s) after all other middlewares.",
@@ -507,10 +524,12 @@
         "directory": {
           "type": "string",
           "minLength": 1,
-          "description": "Directory for static contents."
+          "description": "Directory for static contents.",
+          "link": "https://webpack.js.org/configuration/dev-server/#directory"
         },
         "staticOptions": {
           "type": "object",
+          "link": "https://webpack.js.org/configuration/dev-server/#staticoptions",
           "additionalProperties": true
         },
         "publicPath": {
@@ -526,7 +545,8 @@
               "type": "string"
             }
           ],
-          "description": "The static files will be available in the browser under this public path."
+          "description": "The static files will be available in the browser under this public path.",
+          "link": "https://webpack.js.org/configuration/dev-server/#publicpath"
         },
         "serveIndex": {
           "anyOf": [
@@ -538,7 +558,8 @@
               "additionalProperties": true
             }
           ],
-          "description": "Tells dev server to use serveIndex middleware when enabled."
+          "description": "Tells dev server to use serveIndex middleware when enabled.",
+          "link": "https://webpack.js.org/configuration/dev-server/#serveindex"
         },
         "watch": {
           "anyOf": [
@@ -551,7 +572,8 @@
               "link": "https://github.com/paulmillr/chokidar#api"
             }
           ],
-          "description": "Watches for files in static content directory."
+          "description": "Watches for files in static content directory.",
+          "link": "https://webpack.js.org/configuration/dev-server/#watch"
         }
       }
     },
@@ -712,6 +734,9 @@
     "liveReload": {
       "$ref": "#/definitions/LiveReload"
     },
+    "magicHtml": {
+      "$ref": "#/definitions/MagicHTML"
+    },
     "onAfterSetupMiddleware": {
       "$ref": "#/definitions/OnAfterSetupMiddleware"
     },

package/lib/servers/BaseServer.js

@@ -1,10 +1,10 @@
-'use strict';
+"use strict";
 
 // base class that users should extend if they are making their own
 // server implementation
 module.exports = class BaseServer {
   constructor(server) {
     this.server = server;
-    this.clients = new Set();
+    this.clients = [];
   }
 };

package/lib/servers/SockJSServer.js

@@ -1,16 +1,16 @@
-'use strict';
+"use strict";
 
 /* eslint-disable
   class-methods-use-this
 */
-const sockjs = require('sockjs');
-const BaseServer = require('./BaseServer');
+const sockjs = require("sockjs");
+const BaseServer = require("./BaseServer");
 
 // 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
 {
-  const SockjsSession = require('sockjs/lib/transport').Session;
+  const SockjsSession = require("sockjs/lib/transport").Session;
   const decorateConnection = SockjsSession.prototype.decorateConnection;
 
   // eslint-disable-next-line func-names
@@ -21,8 +21,8 @@ const BaseServer = require('./BaseServer');
 
     if (
       connection.headers &&
-      !('origin' in connection.headers) &&
-      'origin' in req.headers
+      !("origin" in connection.headers) &&
+      "origin" in req.headers
     ) {
       connection.headers.origin = req.headers.origin;
     }
@@ -36,12 +36,12 @@ module.exports = class SockJSServer extends BaseServer {
 
     this.implementation = sockjs.createServer({
       // Use provided up-to-date sockjs-client
-      sockjs_url: '/__webpack_dev_server__/sockjs.bundle.js',
+      sockjs_url: "/__webpack_dev_server__/sockjs.bundle.js",
       // Default logger is very annoy. Limit useless logs.
       log: (severity, line) => {
-        if (severity === 'error') {
+        if (severity === "error") {
           this.server.logger.error(line);
-        } else if (severity === 'info') {
+        } else if (severity === "info") {
           this.server.logger.log(line);
         } else {
           this.server.logger.debug(line);
@@ -50,7 +50,7 @@ module.exports = class SockJSServer extends BaseServer {
     });
 
     const getPrefix = (options) => {
-      if (typeof options.prefix !== 'undefined') {
+      if (typeof options.prefix !== "undefined") {
         return options.prefix;
       }
 
@@ -62,23 +62,20 @@ module.exports = class SockJSServer extends BaseServer {
       prefix: getPrefix(this.server.options.webSocketServer.options),
     });
 
-    this.implementation.on('connection', (client) => {
+    this.implementation.on("connection", (client) => {
       // Implement the the same API as for `ws`
       client.send = client.write;
+      client.terminate = client.close;
 
-      this.clients.add(client);
+      this.clients.push(client);
 
-      client.on('close', () => {
-        this.clients.delete(client);
+      client.on("close", () => {
+        this.clients.splice(this.clients.indexOf(client), 1);
       });
     });
 
-    this.implementation.close = () => {
-      for (const client of this.clients) {
-        client.close();
-      }
-
-      this.clients.clear();
+    this.implementation.close = (callback) => {
+      callback();
     };
   }
 };

package/lib/servers/WebsocketServer.js

@@ -1,10 +1,10 @@
-'use strict';
+"use strict";
 
 /* eslint-disable
   class-methods-use-this
 */
-const WebSocket = require('ws');
-const BaseServer = require('./BaseServer');
+const WebSocket = require("ws");
+const BaseServer = require("./BaseServer");
 
 module.exports = class WebsocketServer extends BaseServer {
   static heartbeatInterval = 1000;
@@ -17,8 +17,8 @@ module.exports = class WebsocketServer extends BaseServer {
       clientTracking: false,
     };
     const isNoServerMode =
-      typeof options.port === 'undefined' &&
-      typeof options.server === 'undefined';
+      typeof options.port === "undefined" &&
+      typeof options.server === "undefined";
 
     if (isNoServerMode) {
       options.noServer = true;
@@ -26,17 +26,17 @@ module.exports = class WebsocketServer extends BaseServer {
 
     this.implementation = new WebSocket.Server(options);
 
-    this.server.server.on('upgrade', (req, sock, head) => {
+    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);
+        this.implementation.emit("connection", connection, req);
       });
     });
 
-    this.implementation.on('error', (err) => {
+    this.implementation.on("error", (err) => {
       this.server.logger.error(err.message);
     });
 
@@ -53,24 +53,22 @@ module.exports = class WebsocketServer extends BaseServer {
       });
     }, WebsocketServer.heartbeatInterval);
 
-    this.implementation.on('connection', (client) => {
-      this.clients.add(client);
+    this.implementation.on("connection", (client) => {
+      this.clients.push(client);
 
       client.isAlive = true;
 
-      client.on('pong', () => {
+      client.on("pong", () => {
         client.isAlive = true;
       });
 
-      client.on('close', () => {
-        this.clients.delete(client);
+      client.on("close", () => {
+        this.clients.splice(this.clients.indexOf(client), 1);
       });
     });
 
-    this.implementation.on('close', () => {
+    this.implementation.on("close", () => {
       clearInterval(interval);
-
-      this.clients.clear();
     });
   }
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "webpack-dev-server",
-  "version": "4.0.0-rc.0",
+  "version": "4.1.1",
   "description": "Serves a webpack app. Updates the browser on changes.",
   "bin": "bin/webpack-dev-server.js",
   "main": "lib/Server.js",
@@ -21,19 +21,21 @@
     "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",
     "test:only": "jest",
     "test:coverage": "npm run test:only -- --coverage",
     "test:watch": "npm run test:coverage --watch",
     "test": "npm run test:coverage",
     "pretest": "npm run lint",
-    "prepare": "npm run build:client && husky install",
-    "build:client": "rimraf ./client/* && babel client-src/ --out-dir client/ --ignore \"webpack.config.js\" && webpack --config client/webpack.config.js",
+    "prepare": "husky install && npm run build",
     "release": "standard-version"
   },
   "dependencies": {
-    "ansi-html": "^0.0.7",
+    "ansi-html-community": "^0.0.8",
     "bonjour": "^3.5.0",
     "chokidar": "^3.5.1",
+    "colorette": "^1.2.2",
     "compression": "^1.7.4",
     "connect-history-api-fallback": "^1.6.0",
     "del": "^6.0.0",
@@ -43,8 +45,6 @@
     "http-proxy-middleware": "^2.0.0",
     "internal-ip": "^6.2.0",
     "ipaddr.js": "^2.0.1",
-    "is-absolute-url": "^3.0.3",
-    "killable": "^1.0.1",
     "open": "^8.0.9",
     "p-retry": "^4.5.0",
     "portfinder": "^1.0.28",
@@ -56,7 +56,7 @@
     "strip-ansi": "^7.0.0",
     "url": "^0.11.0",
     "webpack-dev-middleware": "^5.0.0",
-    "ws": "^7.5.3"
+    "ws": "^8.1.0"
   },
   "devDependencies": {
     "@babel/cli": "^7.14.5",
@@ -66,8 +66,8 @@
     "@babel/plugin-transform-runtime": "^7.14.5",
     "@babel/preset-env": "^7.14.5",
     "@babel/runtime": "^7.14.5",
-    "@commitlint/cli": "^12.1.3",
-    "@commitlint/config-conventional": "^12.1.4",
+    "@commitlint/cli": "^13.1.0",
+    "@commitlint/config-conventional": "^13.1.0",
     "acorn": "^8.2.4",
     "babel-jest": "^27.0.2",
     "babel-loader": "^8.2.2",
@@ -84,10 +84,11 @@
     "http-proxy": "^1.18.1",
     "husky": "^7.0.0",
     "jest": "^27.0.4",
+    "klona": "^2.0.4",
     "less": "^4.1.1",
     "less-loader": "^7.3.0",
     "lint-staged": "^11.0.0",
-    "marked": "^2.0.3",
+    "marked": "^3.0.0",
     "memfs": "^3.2.2",
     "npm-run-all": "^4.1.5",
     "prettier": "^2.3.1",
@@ -96,18 +97,18 @@
     "rimraf": "^3.0.2",
     "sockjs-client": "^1.5.1",
     "standard-version": "^9.3.0",
-    "style-loader": "^2.0.0",
     "strip-ansi-v6": "npm:strip-ansi@^6.0.0",
+    "style-loader": "^2.0.0",
     "supertest": "^6.1.3",
     "tcp-port-used": "^1.0.2",
     "typescript": "^4.2.4",
     "url-loader": "^4.1.1",
-    "webpack": "^5.44.0",
+    "webpack": "^5.50.0",
     "webpack-cli": "^4.7.2",
     "webpack-merge": "^5.8.0"
   },
   "peerDependencies": {
-    "webpack": "^4.0.0 || ^5.0.0"
+    "webpack": "^4.37.0 || ^5.0.0"
   },
   "peerDependenciesMeta": {
     "webpack-cli": {

package/client/modules/logger/SyncBailHookFake.js

@@ -1,10 +0,0 @@
-'use strict';
-/**
- * Client stub for tapable SyncBailHook
- */
-
-module.exports = function clientTapableSyncBailHook() {
-  return {
-    call: function call() {}
-  };
-};

package/client/webpack.config.js

@@ -1,59 +0,0 @@
-'use strict';
-
-var path = require('path');
-
-var webpack = require('webpack');
-
-var _require = require('webpack-merge'),
-    merge = _require.merge;
-
-var baseForModules = {
-  devtool: false,
-  mode: 'development',
-  output: {
-    path: path.resolve(__dirname, '../client/modules'),
-    libraryTarget: 'commonjs2'
-  },
-  target: webpack.webpack ? ['web', 'es5'] : 'web',
-  module: {
-    rules: [{
-      test: /\.js$/,
-      use: [{
-        loader: 'babel-loader'
-      }]
-    }]
-  }
-};
-module.exports = [merge(baseForModules, {
-  entry: path.join(__dirname, 'modules/logger/index.js'),
-  output: {
-    filename: 'logger/index.js'
-  },
-  module: {
-    rules: [{
-      test: /\.js$/,
-      use: [{
-        loader: 'babel-loader',
-        options: {
-          plugins: ['@babel/plugin-transform-object-assign']
-        }
-      }]
-    }]
-  },
-  plugins: [new webpack.DefinePlugin({
-    Symbol: '(typeof Symbol !== "undefined" ? Symbol : function (i) { return i; })'
-  }), new webpack.NormalModuleReplacementPlugin(/^tapable\/lib\/SyncBailHook/, path.join(__dirname, 'modules/logger/SyncBailHookFake.js'))]
-}), merge(baseForModules, {
-  entry: path.join(__dirname, 'modules/strip-ansi/index.js'),
-  output: {
-    filename: 'strip-ansi/index.js'
-  }
-}), merge(baseForModules, {
-  entry: path.join(__dirname, 'modules/sockjs-client/index.js'),
-  output: {
-    filename: 'sockjs-client/index.js',
-    library: 'SockJS',
-    libraryTarget: 'umd',
-    globalObject: "(typeof self !== 'undefined' ? self : this)"
-  }
-})];