Update this plugin for Capacitor 3

[joseph-navant]

Capacitor 3 is being built and is already in beta. In this new version the native plugins have been removed from the core and there are some changes that are necessary in the existing plugins.

Example: Plugin Imports The Plugins object is deprecated, but will continue to work in Capacitor 3. Capacitor plugins should be updated to use the new plugin registration APIs (see the Upgrade Guide for plugins), which will allow them to be imported directly from the plugin’s package.

Going forward, the Plugins object from @capacitor/core should not be used.

// OLD
import { Plugins } from '@capacitor/core';
const { AnyPlugin } = Plugins;
Importing the plugin directly from the plugin’s package is preferred, but the plugin must be updated to work with Capacitor 3 for this to be possible.

// NEW
import { AnyPlugin } from 'any-plugin';

References:

Updating Capacitor to 3.0 in your plugin

Updating Capacitor to 3.0 in your app

(credits to @mklipe for issue explanation)

[mraible]

I started getting the following error in an Ionic app today that uses this plugin.

[ng] Error: node_modules/capacitor-secure-storage-plugin/node_modules/@capacitor/core/types/definitions-internal.d.ts:16:18 - error TS2430: Interface 'CapacitorInstance' incorrectly extends interface 'CapacitorGlobal'.
[ng]   Types of property 'Plugins' are incompatible.
[ng]     Property 'SecureStoragePlugin' is missing in type '{ [pluginName: string]: { [prop: string]: any; }; }' but required in type 'PluginRegistry'.
[ng] 16 export interface CapacitorInstance extends CapacitorGlobal {
[ng]                     ~~~~~~~~~~~~~~~~~
[ng]   node_modules/capacitor-secure-storage-plugin/dist/esm/definitions.d.ts:3:9
[ng]     3         SecureStoragePlugin: SecureStoragePluginPlugin;
[ng]               ~~~~~~~~~~~~~~~~~~~
[ng]     'SecureStoragePlugin' is declared here.

I believe this comes from Ionic AppAuth, but I'm not sure. https://github.com/wi3land/ionic-appauth/issues/60

Any ideas for a workaround?

[VictorCoding]

I'm experiencing the same issue as @mraible, except i'm not using the ionic-appauth plugin.

[casper5822]

Same problem for me, the plugin is incompatible with new packaging of capacitor 3.0. There are not workarounds, the solution i think is only a new plugin version

[VictorCoding]

@mraible @casper5822 So after some more digging it seems that the issue is that the capacitor-secure-storage-plugin is installing @capacitor/core version 3.0.0 since it has @capacitor/core: latest listed as its dependency in its package.json. And well, capacitor-secure-storae-plugin is not compatible with capacitor 3.0.0. Therefore my solution was to force it to install and use @capacitor/core: 2.4.7 instead. I followed this SO post. https://stackoverflow.com/questions/15806152/how-do-i-override-nested-npm-dependency-versions

[martinkasa]

Hi all, I will look at it during weekend.

[casper5822]

@martinkasa thank you, hope you can fix it

[mraible]

Thanks for the tip @VictorCoding! I was able to solve this issue temporarily by creating an npm-shrinkwrap.json file with the following contents.

{
  "dependencies": {
    "capacitor-secure-storage-plugin": {
      "version": "0.4.0",
      "dependencies": {
        "@capacitor/core": {
          "version": "2.4.7"
        }
      }
    }
  }
}

[martinkasa]

Hi all, for use with Capacitor v2 please use fixed version to 0.5.1

"capacitor-secure-storage-plugin": "0.5.1"

for Capacitor 3.0 use latest or 0.6.0

"capacitor-secure-storage-plugin": "^0.6.0"

I have tested both versions, but if you find some bug, feel free to open new issue.