应该大家都看到了昨天开发者工具又有更新了，点进去看到激动人心的这两行，小程序插件。
image.png
作为一个喝粥吃饭都是靠小程序来养活的代码汪，必须第一时间赶紧去看看。
那就说下怎么创建一个插件的项目：
1、首先，你得先把开发者工具更新到最新的版本（1.02.1803130），然后按照文档来说的，正常创建个空文件夹，选中建立插件模板
image.png
2、建立了快速模板之后，会自动生成一个插件包的~生成的文件结构是下面图的那样，其他都默认行了，你需要修改的是红色框的这一块，直接在模板本身修改就可以。
image.png
快速启动模板说明：
1、miniprogram 文件夹是一个普通小程序项目，用来编写小程序插件的使用 Demo，上传插件代码时这个 Demo 会一起上传，并作为小程序插件的发布的审核依据.
2、plugin 文件就是小程序插件项目，用来编写小程序插件的代码。
3、project.config.json 需要关注 compileType 字段，compileType == 'plugin' 时才能正常的使用插件项目。
3、 components/list/list.wxml，插件的结构可以在这里面写
image.png
4、 components/list/list.js，插件的js同样，在这里写
image.png
5、插件的配置文件 components/plugin.json
{
"publicComponents": {
"list": "components/list/list"
},
"main": "index.js"
}
6、最后是上传
image.png
接下来就是怎么去使用插件
1、在小程序后台，在“设置-第三方服务-添加插件”通过appid查找插件去申请使用。
image.png
2、开发者通过申请之后才可以使用。然后可以在小程序的项目里面app.json里面引用声明需要使用的插件
{
"pages": [
"pages/index/index"
],
"plugins": {
"myPlugin": {
"version": "1.0.0", //插件版本号
"provider": "wxc203867c245acd4b" //插件appid
}
}
}
注：多个插件的话，都需要配置版本号和appid
3、使用js接口：引用了插件之后，就可以在小程序的页面js中使用插件提供的js 接口。
var plugin = requirePlugin("myPlugin")
plugin.getSystem() //这里是插件里面exports出来的函数
4、使用插件的组件：在页面对应的json文件中定义需要用的组件(和自定义组件的引用方式差不多，使用 plugin:// 协议就可以了)
{
"usingComponents": {
"list": "plugin://myPlugin/list"
}
}
image.png
网友评论