How can I add support for web workers in a CRACO Webpack application?

Viewed 655

I want to leverage web workers in my react app. I decided to use threads as my supporting library.

For this to function with a webpack bundle threads-plugin must be included. I happen to use CRACO and so I am still able to modify my webpack configuration.

Inside craco.config.js I add the plugin to my webpack object

webpack: {
        plugins: {
            add: [new ThreadsPlugin()]
        }
}

My worker is referenced as

const worker = new Worker('./workers/auth', { type: 'module' });

The error I am seeing on this line is

Failed to load module script: The server responded with a non-JavaScript MIME type of "text/html". Strict MIME type checking is enforced for module scripts per HTML spec.

Perhaps most notably, it appears to be trying to reference the worker as a URL instead of as a path within the bundled app.

:3000/workers/auth:1 

Does this mean that ThreadsPlugin is not being bundled and utalized? What approaches can I take to gather more insight on the issue?


EDIT

I confirmed with logging that the threads-plugin library does get initialized by my webpack config. The larger portion of the library WorkerPlugin.prototype.apply does not seem to fire.

Exploring that I may have missed a step in the setup, asked the author. More details here.

0 Answers
Related