ionic專案之cordova自定義外掛程式的配置

2021-07-27 14:48:34 字數 1932 閱讀 3876

對之前學習的乙個紀錄:

利用plugman自定義外掛程式

1、安裝pullman:npm install -g plugman(需要先裝上nodejs環境才能使用npm)

2、plugman安裝完之後就可以建立乙個外掛程式了,命令如下:

plugman create --name --plugin_id --plugin_version [--path ] [--variable

name=value]

引數說明:

pluginname: 外掛程式名字

pluginid: 外掛程式id, egg : videoplugin 

oversion: 版本, egg : 0.0.1

directory:乙個絕對或相對路徑的目錄,該目錄將建立外掛程式專案

variable name=value: 額外的描述,如作者資訊和相關描述

eg : plugman create --name imvideoplugin --plugin_id imvideoplugin --plugin_version 0.0.1 

命令執行完成之後會生成外掛程式資料夾(包括www、src、plugin.xml),www下面放我們的js檔案,src裡面放我們各自平台的原生**,plugin.xml裡面是對我們外掛程式的一些配置說明。

引數說明:

id:  外掛程式的id

version: 外掛程式的版本

name: 外掛程式的名字

clobbers: 這個是js**呼叫原生**的引用

這樣乙個外掛程式就配置完了,可以cd進入ionic專案用:cordova plugin add 外掛程式路徑 ,這個命令來新增外掛程式(需要用npm安裝cordova) ,cordova plugin remove 外掛程式id,這個命令來移除外掛程式,

外掛程式的編寫稍後會說。

上面是通過plugman工具幫助我們自動安裝,那麼他到底做了什麼呢??,如果不使用plugman我們可以怎麼做呢??方法如下:

以ios專案為例,安裝外掛程式其實為我們做了這些操作:

1、匯入複製外掛程式中使用的相應第三方sdk(例如支付寶支付外掛程式需要支付寶的sdk等),

2、用xcode開啟我們用ionic新增的ios專案,可以看見有如下檔案:

首先在staging裡面的config.xml進行配置:新增配置如下:

然後對staging->www->cordova_plugins.js進行配置:配置如下:

接下來看一下本外掛程式供前端呼叫的imvideo.js的編寫,下圖的

cordova-plugin-imvideo.im 應與上圖中配置的id一致

js方法呼叫**:

最後我們看一下oc裡面接收的**:

Cordova 6 1 ionic 安裝和配置

在安裝框架之前需要準備好的環境如下 win 32位 node.js 4.4.4 win 64位 node.js 4.4.4 node.js官網 官網 這些環境的安裝和配置網上有太多了。就不在囉嗦的。準備好後就可以安裝需要的框架了。安裝命令 npm install g ionic cordova 這裡...

cordova專案建立

cordova 搭建專案步驟 分別是 專案名稱 目錄名稱 包名,專案名字 2.進入剛才已經建立的專案中,這時候可以新增外掛程式或是新增平台,無先後順序,新增外掛程式命令 cordova plugin add 基本裝置資訊 裝置 api cordova plugin add org.apache.co...

ionic2 cordova外掛程式用法之二

之前參考官方的寫了一種用法,但是這種用法不是很方便,於是再寫個方便一些的。以cordova plugin wechat為例 在專案中建立wechat plugin.ts,如下 declare var wechat any 此處宣告plugin.xml中clobbers對應的值 export inte...