ericblade / quagga2-react-example

Showcasing Quagga2 in combination with ReactJS
MIT License
62 stars 40 forks source link

Cannot read property 'ImageWrapper' of undefined at self.onmessage #3

Closed SidMorad closed 4 years ago

SidMorad commented 4 years ago

First thank you for this up to date example. I did integrate this example into my current project. But I see following error on Scanner initialization:

Uncaught TypeError: Cannot read property 'ImageWrapper' of undefined
    at self.onmessage (32307bc5-fa37-40af-a651-728171f8522c:30)

My first guess is: this is Webpack related, but since example's configuration is quite simple, and my project is not, I haven't figure out what difference will cause this?

My second guess is: I do initialize Quagga in a modal, and that might be a problem?

I appropriate any light on this in advance, thanks.

p.s. This is what I see after I click on error link:

(function rn(t) {
      if (t) {
        var n = t().default;
        if (!n) return void self.postMessage({
          event: "error",
          message: "Quagga could not be created"
        });
      }
...
      self.onmessage = function (t) {
        if ("init" === t.data.cmd) {
          var i = t.data.config;
          i.numOfWorkers = 0, e = new n.ImageWrapper({
            x: t.data.size.x,
            y: t.data.size.y
          }, new Uint8Array(t.data.imageData)), n.init(i, o, e), n.onProcessed(r);
        } else "process" === t.data.cmd ? (e.data = new Uint8Array(t.data.imageData), n.start()) : "setReaders" === t.data.cmd ? n.setReaders(t.data.readers) : "registerReader" === t.data.cmd && n.registerReader(t.data.name, t.data.reader);
      };
ericblade commented 4 years ago

Hi! You'll want to set your version of quagga2 to 0.0.13+ or 0.0.10, or set the numOfWorkers config parameter to 0. I've discovered several issues related to workers, and if using 0.0.13+ it should always be set to 0. If you need that feature, pin your package version to 0.0.10.

Basically, the root of this specific problem, is that in 0.0.11, where typescript started coming into the package, i discovered that the Worker implementation that I inherited here is not going to work with the more up-to-date versions of webpack that are necessary for some of the newer things -- the entire library gets loaded by every worker thread, and it used a custom webpack plugin that doesn't look to be easily portable to the newer webpack, to do that. It's also probably quite a resource drain compared to what it should be. Attempting to quickly replicate that setup with the newer webpack version simply resulted in webpack infinite looping while trying to package.

On top of that, the current Workers implementation doesn't work with custom readers,doesn't work in Node, and is of questionable use, since each worker is executing the exact same code on every thread, so they're all duplicating each other's work. A restructuring of Worker support in the main library should be able to fix all of that, as well as fix broken parallel decoding of multiple images.

So, I disabled the entire feature for now, in the interest of being able to refactor it in the hopefully not too distant future.

ericblade commented 4 years ago

... and i have just realized that i've made an error in 0.0.13, as i only disabled numOfWorkers for decodeSingle() .. going to issue an update in a few minutes that will fix it.

ericblade commented 4 years ago

That is fixed now, in quagga2 0.0.14, thanks for pointing it out. I've tested this repo against it now.