objective-c - Ionic 4：如何导入自定义插件(Ionic 4 : How import a custom plugin)

Question

I create a ionic plugin with Plugman command.

(我用Plugman命令创建了一个离子插件。)

My plugin is: SayHello

(我的插件是：SayHello)

This is the content of SayHello.js :

(这是SayHello.js的内容：)

var exec = require('cordova/exec');

exports.coolMethod = function (arg0, success, error) {
    exec(success, error, 'SayHello', 'coolMethod', [arg0]);
};

And this is the content of SayHello.m :

(这是SayHello.m的内容：)

/********* SayHello.m Cordova Plugin Implementation *******/

#import <Cordova/CDV.h>

@interface SayHello : CDVPlugin {
  // Member variables go here.
}

- (void)coolMethod:(CDVInvokedUrlCommand*)command;
@end

@implementation SayHello

- (void)coolMethod:(CDVInvokedUrlCommand*)command
{
    NSLog(@"===============> Hello Seikida !");

    CDVPluginResult* pluginResult = nil;
    NSString* echo = [command.arguments objectAtIndex:0];

    if (echo != nil && [echo length] > 0) {
        pluginResult = [CDVPluginResult resultWithStatus:CDVCommandStatus_OK messageAsString:echo];
    } else {
        pluginResult = [CDVPluginResult resultWithStatus:CDVCommandStatus_ERROR];
    }

    [self.commandDelegate sendPluginResult:pluginResult callbackId:command.callbackId];
}

@end

I installed my custom plugin on my ionic project (ionic 4) :

(我在ionic项目（ionic 4）上安装了自定义插件：)

Everything is good (= I don't have error when I run my project on my devise) but I don't know how to call the coolMethod.

(一切都很好（=当我在自己的设备上运行项目时，我没有错误），但是我不知道如何调用coolMethod。)

To create my plugin, I follow this topic: Ionic Plugin Creation Using Plugman

(要创建我的插件，请遵循以下主题： 使用Plugman创建离子插件)

but they used a old ionic version (example: there is not Home.ts file on ionic 4).

(但他们使用的是旧的离子版本（例如：离子4上没有Home.ts文件）。)

Can you help me to understand how to use my plugin on the home.page.ts ?

(您可以帮助我了解如何在home.page.ts上使用我的插件吗？)

How import my plugin ?

(如何导入我的插件？)

(And do you have a example?)

(（你有例子吗？）)

Thank you

(谢谢)

  ask by seikida translate from so

Answer 1

What you need to to is create an Ionic wrapper for your plugin, copy it into your Ionic project, import it and register the provider.

(您需要为插件创建一个Ionic包装器，将其复制到Ionic项目中，导入并注册提供程序。)

After that you will be able to inject your plugin and use it.

(之后，您将能够注入您的插件并使用它。)

Summing up, you have to do this:

(总结一下，您必须这样做：)

1. Import the ionic-native repo ( https://github.com/ionic-team/ionic-native )

   (导入ionic-native存储库（ https://github.com/ionic-team/ionic-native ）)

2. Create an Ionic wrapper with the tool gulp inside the ionic-native directory and set it up

   (使用ionic-native目录中的gulp工具创建一个Ionic包装器并进行设置)

3. Compile the wrapper and copy the result into your project under the directory node_modules/@ionic-native

   (编译包装程序并将结果复制到您的项目中，位于目录node_modules/@ionic-native)

4. Register the provider in app.module.ts (you probably have done this before when installing some other existing plugin)

   (在app.module.ts注册提供程序（安装其他现有插件之前，您可能已经完成了此操作）)

5. Import and inject the plugin in my-page.page.ts (also probably done before)

   (将插件导入并注入到my-page.page.ts （也可能之前完成）)

6. Enjoy

   (请享用)

The setting up of the plugin is specially tricky and you have to be very careful with the naming of things in src/@ionic-native/plugins/my-plugin/index.ts .

(插件的设置特别棘手，在src/@ionic-native/plugins/my-plugin/index.ts的命名必须非常小心。)

If you don't do it right, you'll get a "plugin not installed" error on runtime.

(如果操作不正确，则会在运行时收到“未安装插件”错误。)

In this case, correct a repeat step 3.

(在这种情况下，请纠正重复的步骤3。)

You probably need more detailed information.

(您可能需要更多详细信息。)

Following the step by step guide in this tutorial I wrote you wont get lost.

(按照我写的本教程中的分步指南，您不会迷路。)

You can probably jump to step 5, considering where you got stuck, but I recommend to read from the beginning to make yourself in context.

(考虑到您遇到的困难，您可能可以跳到第5步，但是我建议从头开始阅读以使自己适应环境。)

Hope this helps!

(希望这可以帮助！)