search

samsam2310 / zbar.wasm

A wasm build of C/C++ ZBar barcode scanning library.
GNU Lesser General Public License v2.1
222 stars 30 forks source link

Integration into browser broject using vite #21

Open cminkwitz opened 2 years ago

cminkwitz commented 2 years ago

I recently came across this project. First of all thank you very much for the great work.

I had a little bit of trouble integrating it in a vue3 project. As Vue3 uses vite by default, i had some issues regarding the commonjs module structure that is generated using the current build method. I think to use the -s MODULARIZE=1 was a very good idea. But using the .mjs output works even better. Vite also is capable of loading wasm files out of the box, so there is no need for the .bin hack. I created tried to create a PR, but it seems i don't have the permissions to push a new branch. Mayby you could provide me with the permissions so i can push my code and could help to further improve the DX of the project.

samsam2310 commented 2 years ago

Hi,

It is great that you would like to contribute! Just fork the project and you can create PR from your forked repo. Here is the official document.

Also I'm not sure what is the issue that you cannot use the current implementation. We have several issues discussed about using this in several frameworks. You may want to take a look. My goal is creating a single solution for everyone. If it is not possible for what you are using, maybe we can have some patch. However, we also need to make sure that don't break other cases.

wesbos commented 2 years ago

@cminkwitz did you figure out how to import this with Vite?

wesbos commented 2 years ago

@samsam2310 Can you help me figure out how to make this work with Vite?

import { scanImageData } from 'zbar.wasm';

gives me:

ERROR: No loader is configured for ".bin" files: node_modules/zbar.wasm/dist/zbar.wasm.bin

I've tried importing all the exported node_module files directly but can't figure it out. Any help?

wesbos commented 2 years ago

Reduced test case posted here: https://github.com/wesbos/vite-wasm

samsam2310 commented 2 years ago

Since the message is ERROR: No loader is configured, maybe you just need to config a loader for *.wasm.bin ?

wesbos commented 2 years ago

The fix for this ended up being to use the fork of this project that ships a ES Module version.

https://www.npmjs.com/package/@undecaf/zbar-wasm

I tried everything to get this one to work with Vite but I couldn't get it going. Vite is really cranky about importing URLs and I couldn't figure i tout.