Capacitor Plugin shows as undefined on android build

Question

Here's a capacitor plugin I found https://github.com/JhonArlex/capacitor_qrcode and I want it to integrate it to my ionic app, on web serve it works as expected, but when I try on livereload on android, the error screen pops out and says the plugin is undefined..

import "capacitor_qrcode";
import { Plugins } from "@capacitor/core";

//..

await Plugins.QRCodePlugin.getCodeQR();
// QRCodePlugin is undefined?

I'm using Ionic React Capacitor... also would appreciate if you can suggest any other way I could integrate QR code scanning feature on my app thanks!

Answer 1

When using your own plugins you need to register/add it into your android MainActivity. https://capacitor.ionicframework.com/docs/plugins/android#export-to-capacitor

Like this:

import com.jhon.capacitor_qrcode.QRCodePlugin;

public class MainActivity extends BridgeActivity {
  @Override
  public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);

    // Initializes the Bridge
    this.init(savedInstanceState, new ArrayList<Class<? extends Plugin>>() {{
      // Additional plugins you've installed go here
      // Ex: add(TotallyAwesomePlugin.class);
      add(QRCodePlugin.class);
    }});
  }
}