worker-loader не может работать с wasm-loader и typescript в проекте React
Я пытался:
// Worker.ts
// @ts-ignore
// eslint-disable-next-line no-restricted-globals
const ctx: Worker = self as any;
// Post data to parent thread
// ctx.postMessage({ foo: "foo" });
// Respond to message from parent thread
ctx.addEventListener('message', async ({ data }) => {
const {
href,
width,
height
} = data;
const { qrcode } = await import('uranus-qrcode');
const qr = qrcode(href, width, height);
ctx.postMessage({ href, qr });
});
в котором uranus-qrcode
это созданный мной модуль Rust-Wasm. Я использую wasm-loader для его загрузки, и он работает, когда я загружаю его в основной поток, но когда я попробовал его с помощью worker-loader, он говорит:
Uncaught (in promise) TypeError: Cannot read property './modules/uranus_qrcode/uranus_qrcode_bg.wasm' of undefined
at Object../modules/uranus_qrcode/uranus_qrcode_bg.wasm (http://localhost:3334/0.34621aa454b5fe6ea3b4.worker.js:145:40)
at __webpack_require__ (http://localhost:3334/34621aa454b5fe6ea3b4.worker.js:34:30)
at Module../modules/uranus_qrcode/uranus_qrcode.js (http://localhost:3334/0.34621aa454b5fe6ea3b4.worker.js:12:80)
at __webpack_require__ (http://localhost:3334/34621aa454b5fe6ea3b4.worker.js:34:30)
at async http://localhost:3334/34621aa454b5fe6ea3b4.worker.js:139:7
1 ответ
Теперь метод workerize работает!
Изначально я пробовал workerize-loader + wasm-loader, и он неплохо работает в режиме dev, но после компиляции прототип не будет добавлен в worker (подозревая, что это ошибка в workerize-loader, потому что все рабочие модули веди себя так же). Это действительно оказывается ошибкой в workerize-loader (см. Workerize-loader не работал после компиляции, а версия 1.2.0 не экспортирует функцию для экземпляра worker в производственном режиме). После обновления до workerize-loader 1.2.1 он работает как в коде разработки, так и в продукте.
Я обновил главное репозиторий: https://github.com/aeroxy/react-typescript-webassembly-starter.git