Web Worker doesn't seem to be working on Production

Question

I have been trying to use web worker on my React application, and pretty much succeeded in doing so locally. But, after deploying it to docker-container and EC2 instance afterward, I'm getting the next issue which is closely related to Web Worker and occurs in generated Blob:

Uncaught ReferenceError: Bd is not defined at e2ecb260-c7b7-486e-9c70-d47bd6b30c4d:1:30.

CreateWebWorker.js

export default class CreateWebWorker {
  constructor(worker) {
    let code = worker.toString();
    code = code.substring(code.indexOf('{') + 1, code.lastIndexOf('}'));

    const blob = new Blob([code], { type: 'application/javascript' });
    return new Worker(URL.createObjectURL(blob));
  }
}

FetchingImagesWorker.js

export default function FetchingImagesWorker() {
  self.onmessage = async (event) => {
    ... 
  }
}

And the way I'm using it in one of React components:

const worker = new CreateWebWorker(FetchingImagesWorker);

Would be much appreciated on any information.

Answer 1

So, if anybody is wondering how they could've fixed the issue with Web Worker not being allocated properly on the production instance:

Since the project is running Webpack Version 5+, the way I registered a Web Worker wasn't correct. The CreateWebWorker.js isn't needed as well.

You only have to modify the usage:

const webWorker = new Worker(new URL('../../workers/fetchingImages.worker.js', import.meta.url));