Asset list

README.md

@@ -38,6 +38,32 @@ let o = {foo: 'foo'}
 _.has(o, 'foo') // true
 ```
 
+## Service Workers
+
+Note: Service workers cannot use the `inline` option. `require('worker?service&inline!./worker')` the `inline` here is ignored.
+
+``` javascript
+// main.js
+var MyWorker = require("worker?service!./worker.js");
+
+// Options passed here become the 2nd parameter to navigator.serviceWorker.register
+MyWorker({ scope: '/' }).then((registration) => {
+    console.log('registration successful')
+}).catch((err) => {
+    console.log('registration failed', err)
+})
+```
+
+See [navigator.serviceWorker.register](https://developer.mozilla.org/en-US/docs/Web/API/ServiceWorkerContainer/register) for available options. At the time of this writing it appears the only option is `scope`.
+
+
+### __assets__
+
+Service Workers may need to know the list of files Webpack produced. See [Introduction to Service Worker](http://www.html5rocks.com/en/tutorials/service-worker/introduction/) for an example of how the worker could cache your site.
+
+If your Service Worker needs an array of filenames webpack produced you can reference the magic value `__assets__` inside the worker. This will *not* work inside your main application as it depends on a Worker-only feature ([`importScripts`](https://developer.mozilla.org/en-US/docs/Web/API/Web_Workers_API/Using_web_workers#Importing_scripts_and_libraries))
+
+
 ## License
 
 MIT (http://www.opensource.org/licenses/mit-license.php)

index.js

@@ -1,4 +1,5 @@
 var WebWorkerTemplatePlugin = require("webpack/lib/webworker/WebWorkerTemplatePlugin");
+var ConstDependency = require('webpack/lib/dependencies/ConstDependency');
 var SingleEntryPlugin = require("webpack/lib/SingleEntryPlugin");
 var path = require("path");
 
@@ -38,16 +39,66 @@ module.exports.pitch = function(request) {
 			compilation.cache = compilation.cache[subCache];
 		}
 	});
+
+	// If the user doesn't include the magic `__assets__` anywhere, there is no
+	// need to produce an asset file.
+	var includeAssets = false
+
+	// I don't know how to register this in webpack to get a hashed filename.
+	// This is my temporary hack to use while I try to find a good solution.
+	var BAD_HASH = Math.random().toString(36).substring(2, 10)
+	// Service workers won't update if the file hasn't changed, so it's
+	// important that __assets__ changes any time the list of assets has
+	// changed. Ideally it would not change if the list of assets hasn't
+	// changed.
+	var assetListFilename = "assets." + BAD_HASH + ".js"
+
+	workerCompiler.parser.plugin("expression __assets__" , function(expr) {
+		includeAssets = true;
+		// importScripts can only be used inside a worker and it's much like a `<script>` tag.
+		const dep = new ConstDependency("(importScripts("  + JSON.stringify(assetListFilename) + "), __asset_list)", expr.range);
+		dep.loc = expr.loc;
+		this.state.current.addDependency(dep);
+		return true
+	})
+
+	// I know this is hacky, but I don't know how else to do this. In my (weak)
+	// defense... it is documented
+	// http://webpack.github.io/docs/loaders.html#_compiler
+	this._compiler.plugin('emit', function(compilation, callback) {
+		if (includeAssets) {
+			var fileContent = "__asset_list = " + JSON.stringify(
+				Object.keys(compilation.assets).sort()
+			)
+
+			compilation.assets[assetListFilename] = {
+				source: function() {
+					return fileContent;
+				},
+				size: function() {
+					return fileContent.length;
+				}
+			};
+		}
+
+		callback()
+	});
+
 	workerCompiler.runAsChild(function(err, entries, compilation) {
 		if(err) return callback(err);
 		if (entries[0]) {
 			var workerFile = entries[0].files[0];
-			var constructor = "new Worker(__webpack_public_path__ + " + JSON.stringify(workerFile) + ")";
-			if(query.inline) {
-				constructor = "require(" + JSON.stringify("!!" + path.join(__dirname, "createInlineWorker.js")) + ")(" +
+			var constructor
+			if(query.service) {
+				constructor = "navigator.serviceWorker.register(__webpack_public_path__ + " + JSON.stringify(workerFile) + ", options);"
+			} else {
+				constructor = "new Worker(__webpack_public_path__ + " + JSON.stringify(workerFile) + ")";
+				if(query.inline) {
+					constructor = "require(" + JSON.stringify("!!" + path.join(__dirname, "createInlineWorker.js")) + ")(" +
 					JSON.stringify(compilation.assets[workerFile].source()) + ", __webpack_public_path__ + " + JSON.stringify(workerFile) + ")";
+				}
 			}
-			return callback(null, "module.exports = function() {\n\treturn " + constructor + ";\n};");
+			return callback(null, "module.exports = function(options) {\n\treturn " + constructor + ";\n};");
 		} else {
 			return callback(null, null);
 		}