Capacitor/Ionic4: BarcodeScanner with plugin_not_installed

Question

I am having trouble adding BarcodeScanner to my android build, the error was plugin_not_installed.

The app compiled without any errors, but it outputs the error on runtime. I have also tried removing/adding the android folder but still no luck.

Does anyone know what was causing this?

Install:

npm install --save @ionic-native/[email protected]

app.module.ts:

import { BarcodeScanner } from '@ionic-native/barcode-scanner/ngx';

@NgModule({
    ...

    providers: [
        ...
        BarcodeScanner
        ...
    ]
    ...
})

home.ts:

import { BarcodeScanner, BarcodeScannerOptions } from '@ionic-native/barcode-scanner/ngx';

@Component({
  ...
})
export class HomePage implements OnInit {
  private options: BarcodeScannerOptions;

  constructor(private barcodeScanner: BarcodeScanner) {}

  scan() {
    this.options = {
      prompt: "Scan your qrcode "
    }
    this.barcodeScanner.scan(this.options).then((barcodeData) => {
      ...
    }, err => {
      console.log("Error occured : " + err);
    });
  }//func scan

}//class HomePage

======

Dependencies:

Traditionalism

Were you able to get this to work on an actual device instead of PWA? I'm seeing a lot of people complaining about this plugin not working with Capacitor. Which would be a deal breaker for me in a current project. :( – Mcwhorter

@Mcwhorter Yea, I remember it worked on Android devices. – Traditionalism

Just to confirm, I got it working on iOS as well (with capacitor). – Mcwhorter

Answer 1

You just installed the ionic native wrapper for the plugin, but not the plugin

For Cordova

ionic cordova plugin add phonegap-plugin-barcodescanner

For Capacitor

npm install phonegap-plugin-barcodescanner

Bayonet

Answer 2

Important to note, sometimes package.json does not get updated if you give a command without "--save". For instance, npm install phonegap-plugin-barcodescanner was not updating config.xml and package.json. This might waste a lot of your time while getting the "Plugin_not_installed" error.

Follow the below steps and it should work seamlessly on android phones.

npm install @ionic-native/barcode-scanner --save
npm install phonegap-plugin-barcodescanner --save
npx cap sync

then run it on android,

ionic capacitor run android. 

Please note, the above solution is only if you are getting an error plugin_not_installed.

Sample Execution Code:

declare let window: any;

  scan(){
    window.cordova.plugins.barcodeScanner.scan(
      result => console.log(result),
      err => this.presentAlert(err),
      {
        showTorchButton: true,
        prompt: "Scan your code",
        formats: "QR_CODE",
        resultDisplayDuration: 0
      }
    );
  }

Thanks

Cotswolds

Answer 3

I was using live reload with capacitor when I had this problem. After trying solutions here with no success, I just had to rebuild the app (after ctrl + c on the terminal to cancel the running app of course):

 ionic cap run android -l --external

All plugins then ran successfully. I don't know if I'm going to have to do this every time I add a plugin, but it works for now

Disgrace