historyApiFallback fix (#617)

webpack · Sep 25, 2016 · a858760 · a858760
1 parent f454402
commit a858760
Show file tree

Hide file tree

Showing 5 changed files with 65 additions and 5 deletions.
diff --git a/examples/history-api-fallback/app.js b/examples/history-api-fallback/app.js
@@ -1,2 +1,34 @@
 var path = document.location.pathname;
 document.write("It's working from path <b>" + path + "</b>");
+
+document.addEventListener("DOMContentLoaded", function() {
+	var tests = [
+		{ url: "/", name: "index", re: /^<!DOCTYPE html>/ },
+		{ url: "/test", name: "unexisting path", re: /^<!DOCTYPE html>/ },
+		{ url: "/file.txt", name: "existing path", re: /^file/ },
+	];
+
+	var table = document.createElement("table");
+	var tbody = document.createElement("tbody");
+	table.appendChild(tbody);
+	document.body.appendChild(table);
+
+	tests.forEach(function(test) {
+		var tr = document.createElement("tr");
+		tbody.appendChild(tr);
+		check(test.url, test.re, function(res) {
+			tr.innerHTML = "<td>" + test.name + "</td>";
+			tr.innerHTML += "<td><a href=\"" + test.url + "\">" + test.url + "</a></td>";
+			tr.innerHTML += "<td class=\"" + res + "\">" + res + "</td>";
+		});
+	});
+});
+
+function check(url, re, cb) {
+	var xhr = new XMLHttpRequest();
+	xhr.addEventListener("load", function() {
+		cb(re.test(xhr.responseText) ? "ok" : "error");
+	});
+	xhr.open("GET", url);
+	xhr.send();
+}
diff --git a/examples/history-api-fallback/file.txt b/examples/history-api-fallback/file.txt
@@ -0,0 +1 @@
+file
diff --git a/examples/history-api-fallback/index.html b/examples/history-api-fallback/index.html
@@ -2,6 +2,25 @@
 <html>
 	<head>
 		<script src="/bundle.js" type="text/javascript" charset="utf-8"></script>
+		<style>
+			table {
+				border-collapse: collapse;
+				border: 1px solid black;
+			}
+			table td {
+				border: 1px dashed black;
+				padding: 2px 15px;
+			}
+			table tr td:last-child {
+				text-align: center;
+			}
+			table td.ok {
+				background-color: #8f8;
+			}
+			table td.error {
+				background-color: #f88;
+			}
+		</style>
 	</head>
 	<body>
 		<h1>Example: history API fallback</h1>

diff --git a/examples/history-api-fallback/webpack.config.js b/examples/history-api-fallback/webpack.config.js
@@ -1,4 +1,9 @@
 module.exports = {
 	context: __dirname,
 	entry: "./app.js",
+	devServer: {
+		historyApiFallback: {
+			disableDotRule: true
+		}
+	}
 }
diff --git a/lib/Server.js b/lib/Server.js
@@ -122,6 +122,8 @@ function Server(compiler, options) {
 		res.end("</body></html>");
 	}.bind(this));
 
+	var contentBase = options.contentBase || process.cwd();
+
 	var features = {
 		compress: function() {
 			if(options.compress) {
@@ -235,13 +237,14 @@ function Server(compiler, options) {
 		historyApiFallback: function() {
 			if(options.historyApiFallback) {
 				// Fall back to /index.html if nothing else matches.
-				app.use(historyApiFallback(typeof options.historyApiFallback === "object" ? options.historyApiFallback : null));
+				app.use(
+					historyApiFallback(typeof options.historyApiFallback === "object" ? options.historyApiFallback : null),
+					express.static(contentBase)
+				);
 			}
 		},
 
 		contentBase: function() {
-			var contentBase = options.contentBase || process.cwd();
-
 			if(Array.isArray(contentBase)) {
 				contentBase.forEach(function(item) {
 					app.get("*", express.static(item));
@@ -293,11 +296,11 @@ function Server(compiler, options) {
 	var defaultFeatures = ["setup", "headers", "middleware"];
 	if(options.proxy)
 		defaultFeatures.push("proxy", "middleware");
-	if(options.historyApiFallback)
-		defaultFeatures.push("historyApiFallback", "middleware");
 	defaultFeatures.push("magicHtml");
 	if(options.contentBase !== false)
 		defaultFeatures.push("contentBase");
+	if(options.historyApiFallback)
+		defaultFeatures.push("historyApiFallback", "middleware");
 	// compress is placed last and uses unshift so that it will be the first middleware used
 	if(options.compress)
 		defaultFeatures.unshift("compress");