Skip to content

workerize-loader failed to work after compiling (react typescript) #89

@aeroxy

Description

@aeroxy

I created a rust-wasm module and use workerize-loader to load it:

export const getQRCode = async (
  arg: string,
  width: number,
  height: number
) => {
  const { qrcode } = await import('uranus-qrcode');
  return qrcode(arg, width, height);
};

and then I use the worker as such:

// @ts-ignore
// eslint-disable-next-line import/no-webpack-loader-syntax
import qrCodeWorker from 'workerize-loader!workers/qrCodeWorker';

...
  const workerizeQRLoader = async () => {
    try {
      const instance = qrCodeWorker();
      const qr = await instance.getQRCode(href, 150, 150);
      setQRCode({
        __html: qr
      });
    } catch (e) {
      console.warn(e);
    }
  };
...
  useEffect(() => {
    workerizeQRLoader();
    // qrLoader();
  // eslint-disable-next-line react-hooks/exhaustive-deps
  }, []);
...

The above works in dev mode, but after compiling it says:

TypeError: a.getQRCode is not a function
    at 8.a2ac9b2e.chunk.js:1
    at l (0.69608c56.chunk.js:2)
    at Generator._invoke (0.69608c56.chunk.js:2)
    at Generator.forEach.e.<computed> [as next] (0.69608c56.chunk.js:2)
    at r (0.69608c56.chunk.js:2)
    at s (0.69608c56.chunk.js:2)
    at 0.69608c56.chunk.js:2
    at new Promise (<anonymous>)
    at 0.69608c56.chunk.js:2
    at 8.a2ac9b2e.chunk.js:1

If I import the rust-wasm module directly into the main thread it works:

...
  const qrLoader = async () => {
    const { qrcode: render } = await import('uranus-qrcode');
    const qr = await render(href, 150, 150);
    setQRCode({
      __html: qr
    });
  };
  useEffect(() => {
    // workerizeQRLoader();
    qrLoader();
  // eslint-disable-next-line react-hooks/exhaustive-deps
  }, []);
...

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions