Estoy trabajando en la implementación del escáner de código QR utilizando el código fuente que encontré en este sitio web:https://www.sitepoint.com/create-qr-code-reader-mobile-website/

y modificando el proyecto que ya existe en codesandbox: https://codesandbox.io/s/qr-code-scanner-ilrm9?file=/src/qrCodeScanner.js

El ejemplo anterior se basa en la biblioteca almacenada en otro sitio web. Quiero crear una aplicación web donde todas las bibliotecas se almacenen localmente como archivos fuente. Creé un proyecto y descargué la biblioteca tal como se proporciona: https://raw.githubusercontent.com/sitepoint-editors/jsqrcode/master/src/qr_packed.js

Luego incluí la biblioteca en el proyecto como qr_packed_download.js. Cambié solo el CSS y dejé la mayor parte del HTML igual que el original. Cuando intento implementar la biblioteca desde el archivo fuente, el escáner no funciona. Recibo un error en qrCodeScanner.js línea 13:

No se pueden establecer propiedades de indefinido (estableciendo 'devolución de llamada')

Supongo que significa que la biblioteca no está cargada en el momento en que se ejecuta el script de escaneo. No hice cambios en ninguno de los dos. Incluso el proyecto original no funciona cuando hago referencia a la biblioteca como un archivo en lugar de un sitio web. ¿Alguien podría ayudarme con esto?

Aquí está el enlace a mi proyecto: https://codesandbox.io/s/scannergui-forked-5l8q2

Hay 3 archivos html, 2 escáneres y una GUI. scanner_screen es el mismo que el original y funciona bien. scanner_bottle involucra la biblioteca como un archivo javascript y no funciona. Este enlace le llevará a una GUI. Al hacer clic en cualquiera de los iconos, se abre la interfaz del escáner.