Help! on WebView-accessible native code import error on Ionic Angular

I’m trying to write a basic WebView-accessible native code to IOS by following this.
I created my Swift and Objective C files in Xcode. When I import the plugin, I get ‘Plugins’ is deprecated error.

The whole error:
‘Plugins’ is deprecated.ts(6385)

global.d.ts(5, 4): The declaration was marked as deprecated here.

(alias) const Plugins: PluginRegistry
import Plugins

Provided for backwards compatibility for Capacitor v2 plugins. Capacitor v3 plugins should import the plugin directly. This “Plugins” export is deprecated in v3, and will be removed in v4.

I see that plugin import has changed in cap 3 update here. I don’t have a package created, so I don’t know how to go forward. Sharing what I have so far.


import Capacitor

public class TestPlugin: CAPPlugin {
      @objc func testCustomPlugin(_ call: CAPPluginCall) {
          let value = call.getString("value") ?? ""
          call.resolve(["value": value])


 #import <Foundation/Foundation.h>
  #import <Capacitor/Capacitor.h>

  CAP_PLUGIN(TestPlugin, "Echo",
      CAP_PLUGIN_METHOD(testCustomPlugin, CAPPluginReturnPromise);
) in Ionic Angular app

import { Component } from '@angular/core';
import { Plugins } from '@capacitor/core';
const { TestPlugin } = Plugins;

    selector: 'app-home',
    templateUrl: '',
    styleUrls: [''],
export class HomePage {
    constructor() {}

    doNativeStuff() {
      TestPlugin.testCustomPlugin({ value: 'Hello World!' });