ionic3 -自定义插件

作者：猿奇
链接：www.greatytc.com/p/9d8c7b7558d8
來源：简书
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。

如有疑问，可评论联系作者，热心解答，从不怼人。。。

1 安装 plugman 插件

npm --registry https://registry.npm.taobao.org install -g plugman

2 新建组件

新建一个插件文件夹，进入插件文件夹。例如新建Plugins文件夹,然后执行下面语句

plugman create --name cordova-plugin-zxing-scan --plugin_id cordova-plugin-zxing-scan  --plugin_version 3.28.19 --path D:\remoteRes\project\plugins
说明：
--name cordova-plugin-zxing-scan//自定义插件名称
--plugin_id cordova-plugin-zxing-scan //自定义插件的包名
--plugin_version 3.28.19//自定义插件版本

执行上述命令后会在Plugins文件夹下生成一个cordova-plugin-zxing-scan文件夹，并且cordova-plugin-zxing-scan文件夹内包含如下内容：

cordova-plugin-zxing-scan|——src |——www |——plugin.xml

3 生成平台（android/ios）插件代码
进入插件的根目录，然后执行创建android或者ios的平台支持命令
cd cordova-plugin-zxing-scan

plugman platform add --platform_name android
npm init
// npm init 给plugin加package.json

命令执行后在cordova-plugin-zxing-scan/src目录下出现了android目录，并且多了一个cordova-plugin-zxing-scan.java文件，打开cordova-plugin-zxing-scan.java文件，更改java文件名为zxingScan.java

package com.cordova.zxing.scan;

import org.apache.cordova.CordovaPlugin;
import org.apache.cordova.CallbackContext;

import org.json.JSONArray;
import org.json.JSONException;
import org.json.JSONObject;

/**
 * This class echoes a string called from JavaScript.
 */
public class zxingScan extends CordovaPlugin {

    @Override
    public boolean execute(String action, JSONArray args, CallbackContext callbackContext) throws JSONException {
        if (action.equals("coolMethod")) {
            String message = args.getString(0);
            this.coolMethod(message, callbackContext);
            return true;
        }
        return false;
    }

    private void coolMethod(String message, CallbackContext callbackContext) {
        if (message != null && message.length() > 0) {
            callbackContext.success(message);
        } else {
            callbackContext.error("Expected one non-empty string argument.");
        }
    }
}

plugin.xml 修改为如下：

<?xml version='1.0' encoding='utf-8'?>
<plugin id="cordova-plugin-zxing-scan" version="3.28.19" xmlns="http://apache.org/cordova/ns/plugins/1.0"
        xmlns:android="http://schemas.android.com/apk/res/android">
  <name>cordova-plugin-zxing-scan</name>
  <engines>
    <engine name="cordova" version="&gt;=3.0.0"/>
  </engines>
  <js-module name="zxingScan" src="www/zxingScan.js">
    <clobbers target="window.plugins.zxingScan"/>
  </js-module>
  <platform name="android">
    <config-file parent="/*" target="res/xml/config.xml">
      <feature name="zxingScan">
        <param name="android-package" value="com.cordova.zxing.scan.zxingScan"/>
      </feature>
    </config-file>
    <config-file parent="/*" target="AndroidManifest.xml">
      <uses-permission android:name="android.permission.CHANGE_WIFI_STATE"/>
      <uses-permission android:name="android.permission.ACCESS_WIFI_STATE"/>
    </config-file>
    <source-file src="src/android/zxingScan.java"
                 target-dir="src/cordova-plugin-zxing-scan/zxingScan"/>
    <!--<framework src="src/android/plugin.gradle" custom="true" type="gradleReference"/>-->
    <!-- Depend on v21 of appcompat-v7 support library -->
   <!-- <framework src="com.android.support:appcompat-v7:21+" />-->
    <!-- Depend on library project included in plugin -->
    <!--<framework src="lib" custom="true" />-->
  </platform>
</plugin>

4 添加到项目
cd 到项目目录

ionic cordova plugin add file:./plugins/cordova-plugin-zxing-scan
npm install --save file:.\plugins\cordova-plugin-zxing-scan

添加成功之后，执行

ionic cordova platform remove android 
ionic cordova platform add android@6.3.0
ionic cordova run android --prod --aot

最后编辑于：2019.03.29 22:21:38