diff --git a/docs/component/_sidebar.md b/docs/component/_sidebar.md index 1dde84b869e4d5d4a1588930d6b7f65cfe0f5286..3b9c7eed5f89fc2b1617658ede0d04b53ea84e18 100644 --- a/docs/component/_sidebar.md +++ b/docs/component/_sidebar.md @@ -82,7 +82,7 @@ * [navigation-bar](component/navigation-bar.md) * 页面属性配置节点 * [page-meta](component/page-meta.md) -* [配置微信小程序插件](component/mp-weixin-plugin.md) +* [配置小程序插件](component/mp-weixin-plugin.md) * [原生组件说明](component/native-component.md)
diff --git a/docs/component/mp-weixin-plugin.md b/docs/component/mp-weixin-plugin.md index 22337272bdb4eea822d728d204514e10107edbd6..6f8263569f90066e6aba32f0dc25300231afdfd8 100644 --- a/docs/component/mp-weixin-plugin.md +++ b/docs/component/mp-weixin-plugin.md @@ -1,32 +1,96 @@ -#### 配置微信小程序插件 +#### 配置小程序插件 -#### 注意事项 +小程序插件是可被添加到小程序内直接使用的功能组件,在不同的小程序内叫法可能略有区别。微信小程序、支付宝小程序中叫`插件`,百度小程序中叫`动态库`,方便起见,以下统一称为插件。 -* 正式开始使用微信小程序插件之前需先在微信公众平台 -> 第三方设置 -> 插件管理处添加插件 -* 要保证项目内微信小程序appid和申请插件的微信小程序appid一致插件才可使用 +**参考文档** + +- [微信小程序插件](https://developers.weixin.qq.com/miniprogram/dev/framework/plugin/using.html) +- [支付宝小程序插件](https://opendocs.alipay.com/mini/plugin/plugin-usage) +- [百度小程序动态库](https://smartprogram.baidu.com/docs/develop/framework/dynamiclib_use/) #### 引入插件代码包 -使用插件之前开发者需要在``manifest.json``中的``mp-weixin``内声明使用的插件,具体配置参照所用插件的开发文档 +使用插件之前开发者需要在`manifest.json`中的各平台对应的字段内声明使用的插件,具体配置参照所用插件的开发文档 **代码示例** +```json +// 微信小程序 +"mp-weixin": { + "plugins": { + "myPlugin": { + "version": "1.0.0", + "provider": "wxidxxxxxxxxxxxxxxxx" + } + } +} + +// 支付宝小程序 +"mp-alipay": { + "myPlugin": { + "version": "*", + "provider": "2019235609092837" + } +} + +// 百度小程序 +"mp-baidu": { + "dynamicLib": { + "myPlugin": { + "provider": "TheUniqueNameOwnedByThisDynamicLib" + } + } +} ``` -"plugins": { - "pluginName": { - "version": "1.0.0", - "provider": "wxidxxxxxxxxxxxxxxxx" + +#### 在页面中使用 + +在页面内使用插件需要在`pages.json`内对应页面的`style`节点下配置,示例如下。 + +以`"hello-component": "plugin://myPlugin/hello-component"`为例,`key`(冒号前的`hello-component`)为在页面内使用的组件名称。`value`分为三段,`plugin`为协议(在百度小程序内为`dynamicLib`),`myPlugin`为插件名称即引入插件时的名称,`hello-component`为插件暴露的组件名称。 + +```json +// 微信小程序 +{ + "path": "pages/index/index", + "style": { + "usingComponents": { + "hello-component": "plugin://myPlugin/hello-component" + } + } +} + +// 支付宝小程序 +{ + "path": "pages/index/index", + "style": { + "usingComponents": { + "hello-component": "plugin://myPlugin/hello-component" + } + } +} + +// 百度小程序 +{ + "path": "pages/index/index", + "style": { + "usingComponents": { + "my-special-list": "dynamicLib://myDynamicLib/special-list" } + } } + ``` #### 在分包内引入插件代码包 +支付宝小程序、百度小程序不支持在分包内引入插件。此外如果项目使用了分包,在支付宝小程序内不可使用插件。本节内容仅针对微信小程序。 + 如果插件只在(同一个插件不能被多个分包同时引用)一个分包用到,可以单独配置到分包中,这样插件不会随主包加载,开发者可以在``pages.json``的[subPackages](/collocation/pages?id=subpackages)中声明插件 **代码示例** -``` +```json "subPackages": [{ "root": "pagesA", "pages": [{ @@ -47,13 +111,10 @@ * 同一个插件不能被多个分包同时引用; * 不能从分包外的页面直接跳入分包内的插件页面,需要先跳入分包内的非插件页面、再跳入同一分包内的插件页面。 -#### 在页面中使用 - -请参照[微信小程序-使用插件](https://developers.weixin.qq.com/miniprogram/dev/framework/plugin/using.html) #### 可能遇到的问题 -* 某些插件可能会需要一些权限才能正常运行,请在``manifest.json``中的``mp-weixin``内配置``permission``[详见](https://developers.weixin.qq.com/miniprogram/dev/reference/configuration/app.html#permission) +* 某些插件可能会需要一些权限才能正常运行,请在`manifest.json`中的`mp-weixin`内配置`permission`[详见](https://developers.weixin.qq.com/miniprogram/dev/reference/configuration/app.html#permission) * 微信开发工具提示 “插件版本不存在”,可能是插件开发文档示例代码中使用的版本已经不存在,请在声明插件处更改版本