bug: extending PluginRegistry doesn't work like stated in the docs

[simonhaenisch]

Description of the problem:

According to the "TypeScript Interface" section of https://capacitor.ionicframework.com/docs/plugins/, it should be possible to merge additional custom Plugins into the PluginRegistry interface:

declare module '@capacitor/core' {
	interface PluginRegistry {
		Echo: EchoPlugin;
	}
}

However this does not work, the type doesn't get merged in:

Instead, the module has to be declared as @capacitor/core/dist/esm/core-plugin-definitions:

declare module '@capacitor/core/dist/esm/core-plugin-definitions' {
	interface PluginRegistry {
		Echo: EchoPlugin;
	}
}

TBH I don't exactly understand why the first version doesn't work, because dist/esm/index.d.ts exports everything from ./core-plugin-definitions 🤷🏻‍♂️

---

Affected platform

• Android
• iOS
• electron
• web

OS of the development machine

• Windows
• macOS
• linux

Capacitor version: beta.25

node version: 10.x

npm version: 6.4

[digaus]

@simonhaenisch I ran into this problem aswell but your solution did not work for me... any idea why?
see https://github.com/digaus/capacitor-background-fcm

(Plugin works fine but it is not so pretty)

[simonhaenisch]

Nope sorry I don't... the workaround works for us with v1.1.0 currently.

[unitree-czk]

@simonhaenisch
I find a method
for instance
import "capacitor-udp"
import { Plugins } from "@capacitor/core";

import the additional package before and you can find your plugin.

[unitree-czk]

@simonhaenisch
Another possibility is that, there might be additional node_modules files within each plugin
vscode might load @capacitor/core within these node_modules instead of the root one.
Some plugins has the setting:
"dependencies": {
"@capacitor/core": "latest"
},
This will cause the installation process to add additional node_modules files inside the plugin folder.
If you delete those node_modules within the plugin folder. It might work.

[fzamperin]

I'm having exact same problema as @simonhaenisch posted (using capacitor v2.4), I just can't make ir appear in the type definition, although if I manually call a function the plugin provides works normally. What @unitree-czk stated but does not work too.

Using the approach below does not work too.

declare module '@capacitor/core/dist/esm/core-plugin-definitions' {
	interface PluginRegistry {
		SecureStorage: SecureStoragePlugin;
	}
}

[imhoffd]

I believe I saw this as well, but upgrading TypeScript to 3.9+ fixed it for me.

[digaus]

@dwieeb
I now have a problem when importing two custom plugins.

Only the first one gets the correct definition. Can you reproduce that?

Edit:

This seems to work nicely:

import '@capacitor-community/file-server';
import '@capacitor-community/wifi';

import { Plugins, PluginRegistry } from '@capacitor/core';
import { FileServerPlugin } from '@capacitor-community/file-server';
import { WifiPlugin } from '@capacitor-community/wifi';



const FileServer: FileServerPlugin = Plugins.FileServer as FileServerPlugin;
const Wifi: WifiPlugin = Plugins.Wifi as WifiPlugin;

const { Filesystem, Device }: PluginRegistry = Plugins;

[swernimo]

I ran into this same issue. Here's my Ionic Info.

For me it was the order of imports. I was importing Plugins before I was importing the custom plugin. Lost about half a day before I found this thread.

[jcesarmobile]

PluginRegistry is now deprecated, the new way of generating plugins should (hopefully) not cause this kind of problems

https://capacitorjs.com/docs/plugins/creating-plugins

[ionitron-bot]

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Capacitor, please create a new issue and ensure the template is fully filled out.