# 小程序插件

插件,是可被添加到小程序内直接使用的功能组件,是对一组 js 接口、自定义组件或页面的封装,。开发者可以像开发小程序一样开发一个插件,供其他小程序使用。同时,小程序开发者可直接在小程序内使用插件,无需重复开发,但是在使用第三那个插件时,无法看到插件的代码。插件适合用来封装自己的功能或服务,提供给第三方小程序进行展示和使用。

开发小程序插件,大致要经过 开通插件功能,填写开发信息,提交审,发布,管理插件使用申请。同时在原生小程序使用插件,要先发出插件申请,等待使用申请通过,插件所有者还可以进行拒绝。 原生小程序开发插件请移步:

新建插件类型的项目后,如果创建示例项目,则项目中将包含三个目录:

  • plugin 目录:插件代码目录。
  • miniprogram 目录:放置一个小程序,用于调试插件。
  • doc 目录:用于放置插件开发文档。

,插件会同时有多个线上版本,由使用插件的小程序决定具体使用的版本号。

# 如何编写一个插件

推荐使用 mpx 官方脚手架 @mpxjs/cli 创建一个小程序插件项目来快速的进入插件开发阶段,首先全局安装 @mpxjs/cli

npm i -g @mpxjs/cli

然后使用 cli 初始化项目

mpx create <project-name>
? 请选择小程序项目所属平台(目前仅微信下支持跨平台输出) wx
? 是否需要跨小程序平台 No
? 是否需要使用小程序云开发能力 No
? 是否是个插件项目?(不清楚请选 No !什么是插件项目请看微信官方文档!) Yes
? 是否需要typescript No
? 项目描述 A mpx project
? 请输入小程序的Appid touristappid

文件目录

  src
  |-- miniprogram // 目录:放置一个小程序,用于调试插件。
  |   --pages
  |   --app.mpx // 引入插件调试
  |-- plugin // 目录:插件代码目录
  |   --components // 插件组件
  |     -- list.mpx // 插件提供的列表组件
  |   --plugin.json // 插件配置文件

我们在 plugin/components/list.mpx 中开发插件中的列表组件,开发完成后,在plugin.json中我们向使用者小程序开放的所有自定义组件、页面和 js 接口,格式如下:

代码示例:

{
  "publicComponents": {
    "list": "./components/list" // 使用mpx 中的webpack 路径引入规范
  },
  "pages": {
    "hello-page": "./pages/hello-page"
  }
}

运行 npm run build/serve 构建小程序产物,在 dist 文件夹下,生成最终的小程序插件产物,使用微信开发者工具,打开代码片段菜单栏,选择插件模式,打开 dist 文件夹。

我们可以像小程序一样预览和上传,但插件没有体验版,同时我们通常将 miniprogram 下的代码当做使用插件的小程序代码,来进行插件的调试和测试。

在开发完插件之后,我们可以上传插件代码,在小程序管理后台进行提交发布审核,审核通过后,就可以提供给第三方小程序使用我们的插件了。

使用 mpx 开发插件的优势相似于使用 mpx 开发小程序项目,可以使用 mpx 的各种增强特性以及跨平台输出的特性,提高开发效率和插件性能。