0

I am using zxing-js/library library for qr code reading. I am facing a strange issue. The code for the qr scanning works in stackblitz online sample code, but not in my local environment. I am getting this error in local environment on run time. The compilation proceeds successfully.

Uncaught SyntaxError: The requested module '/node_modules/@zxing/library/esm5/index.js' does not provide an export named 'BrowserQRCodeReader'

stackblitz link

github link

Abidh
  • 457
  • 2
  • 5
  • 13

2 Answers2

1

It seems like the zxing-js/library has issues with bundling.

I can reproduce the error by running npm run build, followed by npm run start. Looks like some bundling would be required for you to get this working in the browser. See this post for more info

In the meantime, you can use npm run start:dev, and you will be able to do local development as expected.

Thanks @passle_ from the @open-wc team for helping with this.

jlengrand
  • 12,152
  • 14
  • 57
  • 87
0

In addition to jlengrands answer, npm start will start the owc-dev-server which does a minimal amount of work; it'll only resolve the bare modules.

The QR code library that you're trying to use uses commonjs, it'll need a little magic to be transformed so the browser can understand that code. The webpack-dev-server can do this for you, which you can run with npm run start:dev.

passle
  • 146
  • 2