Merge pull request #23 from sveltejs/remove-webpack-dev-middleware

remove webpack-dev-middleware

lib/index.js

@@ -34,39 +34,21 @@ module.exports = function connect(opts) {
 		dev
 	);
 
-	const dev_middleware = dev ? require('webpack-dev-middleware')(client, {
-		noInfo: true,
-		logLevel: 'silent',
-		publicPath: '/client/'
-	}) : null;
-
-	const hot_middleware = dev ? require('webpack-hot-middleware')(client, {
-		reload: true,
-		path: '/__webpack_hmr',
-		heartbeat: 10 * 1000
-	}) : null;
-
-	async function handle_webpack_generated_files(url, req, res, next) {
-		if (dev) {
-			dev_middleware(req, res, () => {
-				hot_middleware(req, res, next);
+	async function handle_webpack_generated_files(req, res, next) {
+		if (req.pathname.startsWith('/client/')) {
+			await compiler.ready;
+			res.set({
+				'Content-Type': 'application/javascript',
+				'Cache-Control': 'max-age=31536000'
 			});
+			res.end(compiler.asset_cache[req.pathname]);
 		} else {
-			if (url.startsWith('/client/')) {
-				await compiler.ready;
-				res.set({
-					'Content-Type': 'application/javascript',
-					'Cache-Control': 'max-age=31536000'
-				});
-				res.end(compiler.asset_cache[url]);
-			} else {
-				next();
-			}
+			next();
 		}
 	}
 
-	async function handle_index(url, req, res, next) {
-		if (url === '/index.html') {
+	async function handle_index(req, res, next) {
+		if (req.pathname === '/index.html') {
 			await compiler.ready;
 			res.set({
 				'Content-Type': 'text/html',
@@ -78,8 +60,8 @@ module.exports = function connect(opts) {
 		}
 	}
 
-	async function handle_service_worker(url, req, res, next) {
-		if (url === '/service-worker.js') {
+	async function handle_service_worker(req, res, next) {
+		if (req.pathname === '/service-worker.js') {
 			await compiler.ready;
 			res.set({
 				'Content-Type': 'application/javascript',
@@ -91,7 +73,9 @@ module.exports = function connect(opts) {
 		}
 	}
 
-	async function handle_route(url, req, res, next) {
+	async function handle_route(req, res, next) {
+		const url = req.pathname;
+
 		// whatever happens, we're going to serve some HTML
 		res.set({
 			'Content-Type': 'text/html'
@@ -148,15 +132,41 @@ module.exports = function connect(opts) {
 		}
 	}
 
-	return async function(req, res, next) {
-		const url = req.url.replace(/\?.+/, '');
-
-		handle_index(url, req, res, () => {
-			handle_service_worker(url, req, res, () => {
-				handle_webpack_generated_files(url, req, res, () => {
-					handle_route(url, req, res, next);
-				});
-			});
-		});
+	const handler = compose_handlers([
+		dev && require('webpack-hot-middleware')(client, {
+			reload: true,
+			path: '/__webpack_hmr',
+			heartbeat: 10 * 1000
+		}),
+
+		handle_index,
+		handle_service_worker,
+		handle_webpack_generated_files,
+		handle_route
+	].filter(Boolean));
+
+	return function(req, res, next) {
+		req.pathname = req.url.replace(/\?.+/, '');
+		handler(req, res, next);
 	};
-};
+};
+
+function compose_handlers(handlers) {
+	return (req, res, next) => {
+		let i = 0;
+		function go() {
+			const handler = handlers[i];
+
+			if (handler) {
+				handler(req, res, () => {
+					i += 1;
+					go();
+				});
+			} else {
+				next();
+			}
+		}
+
+		go();
+	}
+}

lib/utils/create_compiler.js

@@ -111,8 +111,16 @@ module.exports = function create_compiler(client, server, dest, routes, dev) {
 
 		server.plugin('failed', reject);
 
-		// client is already being watched by the middleware,
-		// so we only need to start the server compiler
+		client.watch({}, (err, stats) => {
+			if (stats.hasErrors()) {
+				reject(stats.toJson().errors[0]);
+			} else {
+				client_updated(stats);
+				client_is_ready = true;
+				if (server_is_ready) fulfil();
+			}
+		});
+
 		server.watch({}, (err, stats) => {
 			if (stats.hasErrors()) {
 				reject(stats.toJson().errors[0]);

package.json

@@ -12,7 +12,6 @@
     "mkdirp": "^0.5.1",
     "rimraf": "^2.6.2",
     "webpack": "^3.10.0",
-    "webpack-dev-middleware": "^2.0.1",
     "webpack-hot-middleware": "^2.21.0"
   },
   "devDependencies": {