Webpack Worker Loader: how to make work work as a dependency?

Question

I have index.html import import.

<script src="node_modules/myModule/app.js"></script> 

Mymodule / app.js

 var WebWorker = require('worker-loader!./worker'); window.WebWorker = new WebWorker(); 

Worker exists in node_modules / myModule / worker.js

When I run "webpack", it works because they are in the same folder. If I change something along the way, the web package will not pick up the webmaster code as needed.

Problems arise when using these modules as a dependency, because I need to put worker.js in the same route as index.html.

An alternative is to use Blob and insert the worker as an Inline dependency, but they are not supported in IE11.

So I don’t know if there is a good way to make it work.

Answer 1

you should choose a naming pattern for your employees, say:

myWorkerModule.worker.js

Then configure the webpack desktop loader to process the entire file using this template. Here is the relevant part of webpack.config:

module: { rules: [ { test: /\.worker\.js$/, use: { loader: 'worker-loader' } } ] }

Now that you need this work module as a dependency, just put

var myWorkerModule = require('./myWorkerModule.worker')

or

import myWorkerModule from './myWorkerModule.worker'

Hope this helps.