webpack-dev-server 2.2.0 → 2.4.1

package/lib/OptionsValidationError.js

@@ -2,69 +2,7 @@
 
 const optionsSchema = require("./optionsSchema.json");
 
-function OptionsValidationError(validationErrors) {
-	Error.call(this);
-	Error.captureStackTrace(this, OptionsValidationError);
-	this.name = "WebpackDevServerOptionsValidationError";
-	this.message = `${"Invalid configuration object. " +
-		"webpack-dev-server has been initialised using a configuration object that does not match the API schema.\n"}${
-		validationErrors.map(function(err) {
-			return ` - ${indent(OptionsValidationError.formatValidationError(err), "   ", false)}`;
-		}).join("\n")}`;
-	this.validationErrors = validationErrors;
-}
-module.exports = OptionsValidationError;
-
-OptionsValidationError.prototype = Object.create(Error.prototype);
-OptionsValidationError.prototype.constructor = OptionsValidationError;
-
-OptionsValidationError.formatValidationError = function formatValidationError(err) {
-	const dataPath = `configuration${err.dataPath}`;
-	switch(err.keyword) {
-		case "additionalProperties":
-			return `${dataPath} has an unknown property '${err.params.additionalProperty}'. These properties are valid:\n${
-				getSchemaPartText(err.parentSchema)}`;
-		case "oneOf":
-		case "anyOf":
-		case "enum":
-			return `${dataPath} should be one of these:\n${
-				getSchemaPartText(err.parentSchema)}`;
-		case "allOf":
-			return `${dataPath} should be:\n${
-				getSchemaPartText(err.parentSchema)}`;
-		case "type":
-			switch(err.params.type) {
-				case "object":
-					return `${dataPath} should be an object.`;
-				case "array":
-					return `${dataPath} should be an array.`;
-				case "string":
-					return `${dataPath} should be a string.`;
-				case "boolean":
-					return `${dataPath} should be a boolean.`;
-				case "number":
-					return `${dataPath} should be a number.`;
-			}
-			return `${dataPath} should be ${err.params.type}:\n${
-				getSchemaPartText(err.parentSchema)}`;
-		case "instanceof":
-			return `${dataPath} should be an instance of ${getSchemaPartText(err.parentSchema)}.`;
-		case "required": // eslint-disable-line no-case-declarations
-			const missingProperty = err.params.missingProperty.replace(/^\./, "");
-			return `${dataPath} misses the property '${missingProperty}'.\n${
-				getSchemaPartText(err.parentSchema, ["properties", missingProperty])}`;
-		case "minLength":
-			if(err.params.limit === 1)
-				return `${dataPath} should not be empty.`;
-			else
-				return `${dataPath} ${err.message}`;
-		default:
-			return `${dataPath} ${err.message} (${JSON.stringify(err, 0, 2)}).\n${
-				getSchemaPartText(err.parentSchema)}`;
-	}
-}
-
-function getSchemaPart(path, parents, additionalPath) {
+const getSchemaPart = (path, parents, additionalPath) => {
 	parents = parents || 0;
 	path = path.split("/");
 	path = path.slice(0, path.length - parents);
@@ -79,9 +17,9 @@ function getSchemaPart(path, parents, additionalPath) {
 			schemaPart = inner;
 	}
 	return schemaPart;
-}
+};
 
-function getSchemaPartText(schemaPart, additionalPath) {
+const getSchemaPartText = (schemaPart, additionalPath) => {
 	if(additionalPath) {
 		for(let i = 0; i < additionalPath.length; i++) {
 			const inner = schemaPart[additionalPath[i]];
@@ -94,28 +32,56 @@ function getSchemaPartText(schemaPart, additionalPath) {
 	if(schemaPart.description)
 		schemaText += `\n${schemaPart.description}`;
 	return schemaText;
-}
+};
 
-function formatSchema(schema, prevSchemas) {
-	prevSchemas = prevSchemas || [];
+const indent = (str, prefix, firstLine) => {
+	if(firstLine) {
+		return prefix + str.replace(/\n(?!$)/g, "\n" + prefix);
+	} else {
+		return str.replace(/\n(?!$)/g, `\n${prefix}`);
+	}
+};
+
+class OptionsValidationError extends Error {
+
+	constructor(validationErrors) {
+		super();
+
+		if(Error.hasOwnProperty("captureStackTrace")) {
+			Error.captureStackTrace(this, this.constructor);
+		}
+		this.name = "WebpackDevServerOptionsValidationError";
 
-	function formatInnerSchema(innerSchema, addSelf) {
-		if(!addSelf) return formatSchema(innerSchema, prevSchemas);
-		if(prevSchemas.indexOf(innerSchema) >= 0) return "(recursive)";
-		return formatSchema(innerSchema, prevSchemas.concat(schema));
+		this.message = "Invalid configuration object. " +
+			"webpack-dev-server has been initialised using a configuration object that does not match the API schema.\n" +
+			validationErrors.map(err => " - " + indent(OptionsValidationError.formatValidationError(err), "   ", false)).join("\n");
+		this.validationErrors = validationErrors;
 	}
-	switch(schema.type) {
-		case "string":
+
+	static formatSchema(schema, prevSchemas) {
+		prevSchemas = prevSchemas || [];
+
+		const formatInnerSchema = (innerSchema, addSelf) => {
+			if(!addSelf) return OptionsValidationError.formatSchema(innerSchema, prevSchemas);
+			if(prevSchemas.indexOf(innerSchema) >= 0) return "(recursive)";
+			return OptionsValidationError.formatSchema(innerSchema, prevSchemas.concat(schema));
+		};
+
+		if(schema.type === "string") {
+			if(schema.minLength === 1)
+				return "non-empty string";
+			else if(schema.minLength > 1)
+				return `string (min length ${schema.minLength})`;
 			return "string";
-		case "boolean":
+		} else if(schema.type === "boolean") {
 			return "boolean";
-		case "number":
+		} else if(schema.type === "number") {
 			return "number";
-		case "object":
+		} else if(schema.type === "object") {
 			if(schema.properties) {
 				const required = schema.required || [];
-				return `object { ${Object.keys(schema.properties).map(function(property) {
-					if(required.indexOf(property) < 0) return `${property}?`;
+				return `object { ${Object.keys(schema.properties).map(property => {
+					if(required.indexOf(property) < 0) return property + "?";
 					return property;
 				}).concat(schema.additionalProperties ? ["..."] : []).join(", ")} }`;
 			}
@@ -123,31 +89,71 @@ function formatSchema(schema, prevSchemas) {
 				return `object { <key>: ${formatInnerSchema(schema.additionalProperties)} }`;
 			}
 			return "object";
-		case "array":
+		} else if(schema.type === "array") {
 			return `[${formatInnerSchema(schema.items)}]`;
+		}
+
+		switch(schema.instanceof) {
+			case "Function":
+				return "function";
+			case "RegExp":
+				return "RegExp";
+		}
+		if(schema.$ref) return formatInnerSchema(getSchemaPart(schema.$ref), true);
+		if(schema.allOf) return schema.allOf.map(formatInnerSchema).join(" & ");
+		if(schema.oneOf) return schema.oneOf.map(formatInnerSchema).join(" | ");
+		if(schema.anyOf) return schema.anyOf.map(formatInnerSchema).join(" | ");
+		if(schema.enum) return schema.enum.map(item => JSON.stringify(item)).join(" | ");
+		return JSON.stringify(schema, 0, 2);
 	}
-	switch(schema.instanceof) {
-		case "Function":
-			return "function";
-		case "RegExp":
-			return "RegExp";
-	}
-	if(schema.$ref) return formatInnerSchema(getSchemaPart(schema.$ref), true);
-	if(schema.allOf) return schema.allOf.map(formatInnerSchema).join(" & ");
-	if(schema.oneOf) return schema.oneOf.map(formatInnerSchema).join(" | ");
-	if(schema.anyOf) return schema.anyOf.map(formatInnerSchema).join(" | ");
-	if(schema.enum) return schema.enum.map(function(item) {
-		return JSON.stringify(item);
-	}).join(" | ");
-	return JSON.stringify(schema, 0, 2);
-}
 
-function indent(str, prefix, firstLine) {
-	if(firstLine) {
-		return prefix + str.replace(/\n(?!$)/g, `\n${prefix}`);
-	} else {
-		return str.replace(/\n(?!$)/g, `\n${prefix}`);
+	static formatValidationError(err) {
+		const dataPath = `configuration${err.dataPath}`;
+		if(err.keyword === "additionalProperties") {
+			return `${dataPath} has an unknown property '${err.params.additionalProperty}'. These properties are valid:\n${getSchemaPartText(err.parentSchema)}`;
+		} else if(err.keyword === "oneOf" || err.keyword === "anyOf") {
+			if(err.children && err.children.length > 0) {
+				return `${dataPath} should be one of these:\n${getSchemaPartText(err.parentSchema)}\n` +
+					`Details:\n${err.children.map(err => " * " + indent(OptionsValidationError.formatValidationError(err), "   ", false)).join("\n")}`;
+			}
+			return `${dataPath} should be one of these:\n${getSchemaPartText(err.parentSchema)}`;
+
+		} else if(err.keyword === "enum") {
+			if(err.parentSchema && err.parentSchema.enum && err.parentSchema.enum.length === 1) {
+				return `${dataPath} should be ${getSchemaPartText(err.parentSchema)}`;
+			}
+			return `${dataPath} should be one of these:\n${getSchemaPartText(err.parentSchema)}`;
+		} else if(err.keyword === "allOf") {
+			return `${dataPath} should be:\n${getSchemaPartText(err.parentSchema)}`;
+		} else if(err.keyword === "type") {
+			switch(err.params.type) {
+				case "object":
+					return `${dataPath} should be an object.`;
+				case "string":
+					return `${dataPath} should be a string.`;
+				case "boolean":
+					return `${dataPath} should be a boolean.`;
+				case "number":
+					return `${dataPath} should be a number.`;
+				case "array":
+					return `${dataPath} should be an array:\n${getSchemaPartText(err.parentSchema)}`;
+			}
+			return `${dataPath} should be ${err.params.type}:\n${getSchemaPartText(err.parentSchema)}`;
+		} else if(err.keyword === "instanceof") {
+			return `${dataPath} should be an instance of ${getSchemaPartText(err.parentSchema)}.`;
+		} else if(err.keyword === "required") {
+			const missingProperty = err.params.missingProperty.replace(/^\./, "");
+			return `${dataPath} misses the property '${missingProperty}'.\n${getSchemaPartText(err.parentSchema, ["properties", missingProperty])}`;
+		} else if(err.keyword === "minLength" || err.keyword === "minItems") {
+			if(err.params.limit === 1)
+				return `${dataPath} should not be empty.`;
+			else
+				return `${dataPath} ${err.message}`;
+		} else {
+			// eslint-disable-line no-fallthrough
+			return `${dataPath} ${err.message} (${JSON.stringify(err, 0, 2)}).\n${getSchemaPartText(err.parentSchema)}`;
+		}
 	}
 }
 
-OptionsValidationError.formatSchema = formatSchema;
+module.exports = OptionsValidationError;

package/lib/Server.js

@@ -34,6 +34,7 @@ function Server(compiler, options) {
 	this.hot = options.hot || options.hotOnly;
 	this.headers = options.headers;
 	this.clientLogLevel = options.clientLogLevel;
+	this.clientOverlay = options.overlay;
 	this.sockets = [];
 	this.contentBaseWatchers = [];
 
@@ -317,8 +318,11 @@ function Server(compiler, options) {
 		defaultFeatures.push("contentBaseFiles");
 	if(options.watchContentBase)
 		defaultFeatures.push("watchContentBase");
-	if(options.historyApiFallback)
-		defaultFeatures.push("historyApiFallback", "middleware", "contentBaseFiles");
+	if(options.historyApiFallback) {
+		defaultFeatures.push("historyApiFallback", "middleware");
+		if(contentBase !== false)
+			defaultFeatures.push("contentBaseFiles");
+	}
 	defaultFeatures.push("magicHtml");
 	if(contentBase !== false)
 		defaultFeatures.push("contentBaseIndex");
@@ -400,6 +404,9 @@ Server.prototype.listen = function() {
 		if(this.clientLogLevel)
 			this.sockWrite([conn], "log-level", this.clientLogLevel);
 
+		if(this.clientOverlay)
+			this.sockWrite([conn], "overlay", this.clientOverlay);
+
 		if(this.hot) this.sockWrite([conn], "hot");
 
 		if(!this._stats) return;
@@ -486,4 +493,7 @@ Server.prototype.invalidate = function() {
 	if(this.middleware) this.middleware.invalidate();
 }
 
+// Export this logic, so that other implementations, like task-runners can use it
+Server.addDevServerEntrypoints = require("./util/addDevServerEntrypoints");
+
 module.exports = Server;

package/lib/optionsSchema.json

@@ -34,7 +34,14 @@
     },
     "port": {
       "description": "The port the server listens to.",
-      "type": "number"
+      "anyOf": [
+        {
+          "type": "number"
+        },
+        {
+          "type": "string"
+        }
+      ]
     },
     "socket": {
       "description": "The Unix socket to listen to (instead of on a host).",
@@ -60,6 +67,25 @@
         "error"
       ]
     },
+    "overlay": {
+      "description": "Shows an error overlay in browser.",
+      "anyOf": [
+        {
+          "type": "boolean"
+        },
+        {
+          "type": "object",
+          "properties": {
+            "errors": {
+              "type": "boolean"
+            },
+            "warnings": {
+              "type": "boolean"
+            }
+          }
+        }
+      ]
+    },
     "key": {
       "description": "The contents of a SSL key.",
       "anyOf": [

package/lib/util/addDevServerEntrypoints.js

@@ -0,0 +1,24 @@
+"use strict";
+const createDomain = require("./createDomain");
+
+module.exports = function addDevServerEntrypoints(webpackOptions, devServerOptions) {
+	if(devServerOptions.inline !== false) {
+		const domain = createDomain(devServerOptions);
+		const devClient = [`${require.resolve("../../client/")}?${domain}`];
+
+		if(devServerOptions.hotOnly)
+			devClient.push("webpack/hot/only-dev-server");
+		else if(devServerOptions.hot)
+			devClient.push("webpack/hot/dev-server");
+
+		[].concat(webpackOptions).forEach(function(wpOpt) {
+			if(typeof wpOpt.entry === "object" && !Array.isArray(wpOpt.entry)) {
+				Object.keys(wpOpt.entry).forEach(function(key) {
+					wpOpt.entry[key] = devClient.concat(wpOpt.entry[key]);
+				});
+			} else {
+				wpOpt.entry = devClient.concat(wpOpt.entry);
+			}
+		});
+	}
+};

package/lib/util/createDomain.js

@@ -0,0 +1,13 @@
+"use strict";
+const url = require("url");
+
+module.exports = function createDomain(options) {
+	const protocol = options.https ? "https" : "http";
+
+	// the formatted domain (url without path) of the webpack server
+	return options.public ? `${protocol}://${options.public}` : url.format({
+		protocol: protocol,
+		hostname: options.host,
+		port: options.socket ? 0 : options.port.toString()
+	});
+};

package/package.json

@@ -1,22 +1,24 @@
 {
   "name": "webpack-dev-server",
-  "version": "2.2.0",
+  "version": "2.4.1",
   "author": "Tobias Koppers @sokra",
   "description": "Serves a webpack app. Updates the browser on changes.",
   "peerDependencies": {
     "webpack": "^2.2.0"
   },
   "dependencies": {
+    "ansi-html": "0.0.7",
     "chokidar": "^1.6.0",
     "compression": "^1.5.2",
     "connect-history-api-fallback": "^1.3.0",
     "express": "^4.13.3",
+    "html-entities": "^1.2.0",
     "http-proxy-middleware": "~0.17.1",
     "opn": "4.0.2",
     "portfinder": "^1.0.9",
     "serve-index": "^1.7.2",
     "sockjs": "0.3.18",
-    "sockjs-client": "1.1.1",
+    "sockjs-client": "1.1.2",
     "spdy": "^3.4.1",
     "strip-ansi": "^3.0.0",
     "supports-color": "^3.1.1",
@@ -24,9 +26,9 @@
     "yargs": "^6.0.0"
   },
   "devDependencies": {
-    "css-loader": "~0.25.0",
+    "css-loader": "~0.26.1",
     "eslint": "^3.4.0",
-    "file-loader": "~0.9.0",
+    "file-loader": "~0.10.0",
     "istanbul": "^0.4.5",
     "jquery": "^2.2.0",
     "less": "^2.5.1",
@@ -38,7 +40,7 @@
     "should": "^11.1.0",
     "sinon": "^1.17.6",
     "style-loader": "~0.13.0",
-    "supertest": "^2.0.0",
+    "supertest": "^2.0.1",
     "url-loader": "~0.5.6",
     "webpack": "^2.2.0"
   },
@@ -64,7 +66,7 @@
     "client-live": "webpack ./client/live.js client/live.bundle.js --color --config client/webpack.config.js -p",
     "client-index": "webpack ./client/index.js client/index.bundle.js --color --config client/webpack.config.js -p",
     "client-sockjs": "webpack ./client/sockjs.js client/sockjs.bundle.js --color --config client/webpack.sockjs.config.js -p",
-    "lint": "eslint bin lib test examples client/{index,live,socket,sockjs,webpack.config}.js",
+    "lint": "eslint bin lib test examples client/{index,live,socket,sockjs,overlay,webpack.config}.js",
     "beautify": "npm run lint -- --fix",
     "test": "mocha --full-trace --check-leaks",
     "posttest": "npm run -s lint",