错误 TS2304：找不到名称“QRScanner”

Question

I referring https://www.npmjs.com/package/cordova-plugin-qrscanner and trying to create a QR Scan function in my mobile app.

So for first steps, I am creating the following code in my ts file:

function onDone(err, status){

      if (err) {
       // here we can handle errors and clean up any loose ends.
       console.error(err);
      }
      if (status.authorized) {
        // W00t, you have camera access and the scanner is initialized.
        // QRscanner.show() should feel very fast.
      } else if (status.denied) {
       // The video preview will remain black, and scanning is disabled. We can
       // try to ask the user to change their mind, but we'll have to send them
       // to their device settings with `QRScanner.openSettings()`.
      } else {
        // we didn't get permission, but we didn't get permanently denied. (On
        // Android, a denial isn't permanent unless the user checks the "Don't
        // ask again" box.) We can ask again at the next relevant opportunity.
      }
    }

    QRScanner.prepare(onDone);

However, I am getting error when I am trying to ng build.

TS2304: Cannot find name 'QRScanner'

The following is my version:

• Angular CLI: 10.2.3
• Node: 10.16.3
• OS: linux x64
• Angular: 10.2.5
• npm version: 6.9.0

And my cordova-plugin-qrscanner version in package.json is:

"@types/cordova-plugin-qrscanner": "^1.0.31",
"cordova-plugin-qrscanner": "^3.0.1",

Answer 1

Good day,

I found the solution and the following is some of my understanding. This code is work for older version of angular. I am using angular 10, thus, need to define the QRScanner object first. Which is:

declare var QRScanner: any ;

Or use ( < any > window).QRScanner to get access of the QRScanner plugin.