Support for webpack-dev-middleware, and tests

Author: sokra

.gitignore

@@ -1,5 +1,4 @@
-/node_modules
-/test/js
-/test/browsertest/js
-/test/browsertest/node_modules/vm-browserify
-/examples/*/js
+node_modules
+test/js
+test/browsertest/js
+examples/*/js

.npmignore

@@ -1,6 +1,5 @@
-/node_modules
-/test/js
-/test/browsertest/js
-/test/browsertest/node_modules/vm-browserify
-/examples
+node_modules
+test/js
+test/browsertest/js
+examples
 README.md

README.md

@@ -409,6 +409,7 @@ You can also save this options object in a JSON file and use it with the shell c
  //  "module"           (module, filename) before a module is loaded
  //  "context"          (module, dirname) before a context is loaded
  //  "dependency"       (filename) before a dependency is loaded
+ //  "loader"           (filename) before a loader is required
  //  -- events for progress --
  //  "task"             (name?) start of a task
  //  "task-end"         (name?) end of a task

lib/execLoaders.js

@@ -24,12 +24,23 @@ module.exports = function(context, request, loaders, filenames, contents, cacheE
 		callback(null, contents, true);
 	} else {
 		// try to load all loaders
-		// TODO this doesn't reload the loader if it has changed
-		// TODO to support watch mode better, fix that
 		loaderFunctions = [];
 		try {
 			loaders.forEach(function(name) {
-				var loader = require(name);
+				var loaderFilename = require.resolve(name);
+				options.events.emit("loader", loaderFilename);
+
+				// require loader in fresh context
+				var oldCache = {};
+				for(var entry in require.cache) {
+					oldCache[entry] = require.cache[entry];
+					delete require.cache[entry];
+				}
+				var loader = require(loaderFilename);
+				for(var entry in oldCache) {
+					require.cache[entry] = oldCache[entry];
+				}
+
 				loaderFunctions.push(loader);
 			});
 		} catch(e) {

lib/webpack.js

@@ -203,6 +203,19 @@ module.exports = function(context, moduleName, options, callback) {
 			}));
 		});
 
+		// on before a loader is read
+		options.events.on("loader", function(filename) {
+			if(!filename) return;
+			watchers.push(fs.watch(filename, function() {
+				change();
+			}));
+		});
+
+		// on user defines the bundle as invalid
+		options.events.on("invalid", function() {
+			change();
+		});
+
 		// on bundle finished compiling
 		options.events.on("bundle", function(stats) {
 			isRunning = false;

package.json

@@ -1,6 +1,6 @@
 {
 	"name": "webpack",
-	"version": "0.5.8",
+	"version": "0.5.9",
 	"author": "Tobias Koppers @sokra",
 	"description": "Packs CommonJs/AMD Modules for the browser. Allows to split your codebase into multiple bundles, which can be loaded on demand. Support loading of js, json, jade, coffee, css, ... out of the box and more with custom loaders.",
 	"dependencies": {
@@ -29,7 +29,10 @@
 	],
 	"devDependencies": {
 		"mocha": "*",
-		"should": "*"
+		"should": "*",
+		"vm-browserify": "*",
+		"express": "*",
+		"webpack-dev-middleware": "0.5.x"
 	},
 	"engines": {
 		"node":  ">=0.1.30"

test/browsertest/build.js

@@ -23,33 +23,21 @@ function join(a, b) {
 	return a;
 }
 
-try {
-	require("vm-browserify");
-	compile();
-} catch(e) {
-	console.log("install vm-browserify...");
-	cp.exec("npm install vm-browserify", function (error, stdout, stderr) {
-		console.log(stdout);
-		compile();
-	});
-}
-function compile() {
-	console.log("compile scripts...");
+console.log("compile scripts...");
 
-	var extraArgsNoWatch = extraArgs.slice(0);
-	var watchIndex = extraArgsNoWatch.indexOf("--watch");
-	if(watchIndex != -1) extraArgsNoWatch.splice(watchIndex, 1);
-	var libary1 = cp.spawn("node", join(["../../bin/webpack.js", "--colors", "--single", "--libary", "libary1",
-											"node_modules/libary1", "js/libary1.js"], extraArgsNoWatch));
-	bindOutput(libary1);
-	libary1.on("exit", function(code) {
-		if(code === 0) {
-			var main = cp.spawn("node", join(["../../bin/webpack.js", "--colors", "--alias", "vm=vm-browserify",
-												"--public-prefix", "js/", "lib/index", "js/web.js"], extraArgs));
-			bindOutput(main);
-		}
-	});
-	var libary2 = cp.spawn("node", join(["../../bin/webpack.js", "--colors", "--libary", "libary2",
-										"--script-src-prefix", "js/", "--options", "libary2config.js", "node_modules/libary2", "js/libary2.js"], extraArgs));
-	bindOutput(libary2);
-}
+var extraArgsNoWatch = extraArgs.slice(0);
+var watchIndex = extraArgsNoWatch.indexOf("--watch");
+if(watchIndex != -1) extraArgsNoWatch.splice(watchIndex, 1);
+var libary1 = cp.spawn("node", join(["../../bin/webpack.js", "--colors", "--single", "--libary", "libary1",
+										"node_modules/libary1", "js/libary1.js"], extraArgsNoWatch));
+bindOutput(libary1);
+libary1.on("exit", function(code) {
+	if(code === 0) {
+		var main = cp.spawn("node", join(["../../bin/webpack.js", "--colors", "--alias", "vm=vm-browserify",
+											"--public-prefix", "js/", "lib/index", "js/web.js"], extraArgs));
+		bindOutput(main);
+	}
+});
+var libary2 = cp.spawn("node", join(["../../bin/webpack.js", "--colors", "--libary", "libary2",
+									"--script-src-prefix", "js/", "--options", "libary2config.js", "node_modules/libary2", "js/libary2.js"], extraArgs));
+bindOutput(libary2);

test/browsertest/lib/index.web.js

@@ -137,7 +137,7 @@ require("../css/stylesheet.css");
 require("../less/stylesheet.less");
 
 // file loader
-window.test(require("file/png!../img/image.png").indexOf("js/") === 0, "Buildin 'file' loader, png");
+window.test(require("file/png!../img/image.png").indexOf("js/") >= 0, "Buildin 'file' loader, png");
 setTimeout(function() {
 	document.getElementById("image").src = require("file/png!../img/image.png");
 }, 200);

test/browsertest/middlewareTest.js

@@ -0,0 +1,25 @@
+var webpackMiddleware = require("webpack-dev-middleware");
+var express = require("express");
+var path = require("path");
+
+var app = express();
+
+app.configure(function() {
+	app.use(webpackMiddleware(path.join(__dirname, "lib", "index"), {
+		publicPrefix: "http://localhost:8080/js/",
+		watch: true,
+		watchDelay: 5000,
+		debug: true,
+		output: "web.js",
+		outputPostfix: ".web.js",
+		resolve: {
+			alias: {
+				vm: "vm-browserify"
+			}
+		}
+	}));
+	app.use(express.static(path.join(__dirname)));
+
+});
+
+app.listen(8080);