Change worker chunk name from <ID> to <ID>.worker

README.md

@@ -156,6 +156,12 @@ Similarly, if you need to have WorkerPlugin output a specific `type` value, use
   ]
 ```
 
+### `chunkFilename` _(string)_
+
+By default this plugin will output assets according to parent `output.chunkFilename` setting (with chunk `[name]` being `WORKERNAME.worker`).
+
+If you want another pattern (e.g. constant, no hash) for your workers, you may override this default behavior with a pattern of your choosing.
+
 ## Loader
 
 At its core, worker-plugin provides two features: parsing and handling of `new Worker()`, and standalone bundling of modules for use in a different JavaScript context.
@@ -165,7 +171,7 @@ If all you want is to compile separate bundles for a module, `worker-plugin/load
 ```js
 import workerUrl from 'worker-plugin/loader!./my-worker';
 
-console.log(workerUrl); // "/0.worker.js"
+console.log(workerUrl); // "/worker.js"
 
 CSS.paintWorklet.addModule(workerUrl);
 ```
@@ -180,7 +186,7 @@ Two options are available:
 Options can be supplied inline:
 
 ```js
-import url from 'worker-plugin/loader?name=foo&esModule!./foo';
+import url from 'worker-plugin/loader?name=foo&esModule!./foo'; // "/foo.worker.js"
 ```
 
 ... or by setting up a loader alias:

src/index.js

@@ -86,7 +86,8 @@ export default class WorkerPlugin {
           const isStrictModule = esModule || (parser.state.buildMeta && parser.state.buildMeta.strictHarmonyModule);
 
           // Querystring-encoded loader prefix (faster/cleaner than JSON parameters):
-          const loaderRequest = `${workerLoader}?name=${encodeURIComponent(opts.name || workerId)}${isStrictModule ? '&esModule' : ''}!${dep.string}`;
+          const workerName = `${opts.name || workerId}.worker`;
+          const loaderRequest = `${workerLoader}?name=${encodeURIComponent(workerName)}${isStrictModule ? '&esModule' : ''}!${dep.string}`;
 
           // Unique ID for the worker URL variable:
           const id = `__webpack__worker__${workerId++}`;

src/loader.js

@@ -38,6 +38,7 @@ export function pitch (request) {
   }
 
   const options = loaderUtils.getOptions(this) || {};
+  const chunkName = options.name || 'worker';
   const chunkFilename = compilerOptions.output.chunkFilename.replace(/\.([a-z]+)(\?.+)?$/i, '.worker.$1$2');
   const workerOptions = {
     filename: (options.filename || pluginOptions.filename || chunkFilename).replace(/\[(?:chunkhash|contenthash)(:\d+(?::\d+)?)?\]/g, '[hash$1]'),
@@ -62,7 +63,7 @@ export function pitch (request) {
   (new FetchCompileWasmTemplatePlugin({
     mangleImports: compilerOptions.optimization.mangleWasmImports
   })).apply(workerCompiler);
-  (new SingleEntryPlugin(this.context, request, options.name)).apply(workerCompiler);
+  (new SingleEntryPlugin(this.context, request, chunkName)).apply(workerCompiler);
 
   const subCache = `subcache ${__dirname} ${request}`;
   workerCompiler.hooks.compilation.tap(NAME, compilation => {

test/index.test.js

@@ -136,8 +136,8 @@ describe('worker-plugin', () => {
 
     const assetNames = Object.keys(stats.assets);
     expect(assetNames).toHaveLength(2);
-    expect(assetNames).toContainEqual(expect.stringMatching(/^foo\.[a-zA-Z0-9]+\.worker\.js$/));
-    expect(stats.assets['main.js']).toMatch(/module.exports = __webpack_require__\.p\s*\+\s*"foo\.[a-zA-Z0-9]+\.worker\.js"/g);
+    expect(assetNames).toContainEqual(expect.stringMatching(/^foo\.worker\.[a-zA-Z0-9]+\.js$/));
+    expect(stats.assets['main.js']).toMatch(/module.exports = __webpack_require__\.p\s*\+\s*"foo\.worker\.[a-zA-Z0-9]+\.js"/g);
   });
 
   describe('options.filename / options.chunkFilename', () => {
@@ -309,15 +309,15 @@ describe('worker-plugin', () => {
 
       const assetNames = Object.keys(stats.assets);
       expect(assetNames).toHaveLength(2);
-      expect(assetNames).toContainEqual('0.worker.js');
+      expect(assetNames).toContainEqual('worker.js');
 
       const main = stats.assets['main.js'];
       expect(main).toMatch(/[^\n]*console.log\s*\([^)]*\)[^\n]*/g);
 
       const log = main.match(/\bconsole\.log\s*\(([^)]*)\)[^\n]*/)[1];
       expect(log).toMatch(/worker_plugin_loader_worker__WEBPACK_IMPORTED_MODULE_\d___default.[a-z0-9]+/gi);
 
-      expect(main).toMatch(/module.exports = __webpack_require__\.p\s*\+\s*"0\.worker\.js"/g);
+      expect(main).toMatch(/module.exports = __webpack_require__\.p\s*\+\s*"worker\.js"/g);
     });
   });