Ionic Capacitor 插件开发

NPM 私有库搭建

因为我们很多时候可能并不想使用公有的npm库来保存我们的软件包,但在开发中npm包的方便性确需要我们能够快速安装我们自己和同事开发的软件包,而不需要使用代码拷贝的方式。我的选择也是如此,那如果搭建私有库呢,网上有许多方案,但是有一些非常好的的工具能让我们搭建私有库非常方便简单,以前有一个sinopia,但是作者不维护了,衍生出来的另一个神器,verdaccio(https://github.com/verdaccio/verdaccio)两步就能搞定:

  1. 安装
    npm install --global verdaccio
  2. 执行
    verdaccio

Perfect,搭建完了。enjoy it

使用,把npm 的 registry地址设置为本地地址即可和远程一样使用了
npm set registry http://localhost:4873/

当然,这是全局使用
如果要下载网上的包,还需要切换回来,(当然你也可以使用国内镜像https://registry.npm.taobao.org)
npm set registry http://registry.npmjs.org

Ionic Capacitor 插件开发

1.使用 capacitor的生成器,会一系列步骤,生成插件
npx @capacitor/cli plugin:generate
这将启动一个向导,提示您输入有关新插件的信息。例如:

npx @capacitor/cli plugin:generate
✏️  Creating new Capacitor plugin
? Plugin NPM name (snake-case): my-plugin
? Plugin id (domain-style syntax. ex: com.example.plugin) com.ionicframework.myplugin
? Plugin class name (ex: AwesomePlugin) MyPlugin
? description:
? git repository:
? author:
? license: MIT
? package.json will be created, do you want to continue? (Y/n)

Plugin NPM name:在npm上可用的软件包的蛇形名称(如果您的软件包将在私有npm仓库中,则不是严格的要求)。
Plugin ID:域名样式的标识符。它主要用于Java中的程序包名称。
Plugin Class Name:Java和Swift中使用的类的初始名称。请参阅有关类别名称的其他说明。
description:关于插件的简要介绍。
git repository:git源代码库的URL,将在该源代码中托管插件的源代码。
author(可选):中的插件创建者的名称package.json。
license(可选):绑定插件所依据的许可证。MIT许可证是默认许可证。
package.json will be created:输入“ Y”和/或按Enter / Return完成插件设置。

完成后会产生一个插件目录

每个插件都带有一些TypeScript文件,这些文件仅导出TypeScript接口。这些接口可以为插件的TypeScript使用者提供键入。

从TypeScript接口开始可能是为插件构建API的好方法。例如,这是我们插件的默认界面:

declare module "@capacitor/core" {
  interface PluginRegistry {
    Echo: EchoPlugin;
  }
}

export interface EchoPlugin {
  echo(options: { value: string }): Promise<{value: string}>;
}

发布插件

每当您准备发布插件时,只需使用:

npm publish

注意:发布之前需要 npm login, 不然会出现错误4048
这将构建您插件的JS部分,并将其余插件文件发布到NPM。

现在,可以npm install your-plugin在任何Capacitor应用程序中使用安装软件包了。

Ionic 的 capacitor构建插件真的比cordova简单方便多了。

评论 4
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值