热门标签 | HotTags
当前位置:  开发笔记 > 前端 > 正文

如何开发小程序插件?

如何开发小程序插件?下面本篇文章给大家介绍一下微信小程序的开发使用教程。有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助。
如何开发小程序插件?下面本篇文章给大家介绍一下微信小程序的开发使用教程。有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助。

微信小程序插件的名称也必须是独一无二的,申请完毕后就可以获得插件的AppId了。填写名称和插件AppID后,就可以进入小程序项目。

在文件 project.config.json 中,我们看到代码如下:

{
    miniprogramRoot:./miniprogram,
    pluginRoot:./plugin,
    compileType:plugin,
    setting: {
        newFeature: true
    },
    appid: .....,
    projectname:videoPlayer,
    condition: {}
}

miniprogramRoot:配置小程序的根目录,可以使用小程序来测试编写的插件

pluginRoot:插件相关代码所在的根目录

compileType:项目的编译类型,必须配置为 plugin,在上传代码的时候才会以插件的方式上传到腾讯服务器。

在 plugin/plugin.json 文件中,代码如下:

{
  publicComponents: {
    hgPlayer:components/player/player
  },
  main: index.js
}

publicComponents:配置的是插件可以给使用的小程序提供哪些组件,一个插件可以定义很多个组件,组件和组件之间相互引用,但是小程序只能使用在publicComponents里配置的组件。

main:定义入口文件,在入口文件 index.js 中定义小程序可以使用插件的那些接口。

在 plugin/index.js 文件中,代码如下:

var data =require(\'./api/data.js\')
module.exports= {
  getData: data.getData,
  setData: data.setData
}

在 plugin/index.js 定义了对外抛出接口为 getData 和 setData,小程序在使用这个插件的时候,只能使用到插件提供的这两个接口,插件的其他接口(或方法)小程序无法使用。

做好以上配置后,就可以开始在 plugin/components 编写组件代码了。

代码编写完毕后,注意在 plugin/plugin.json 文件配置。配置好后,我就可以上传插件代码到腾讯服务器,进入微信小程序开发者后台提交审核,腾讯审核通过后,第三方小程序就可以使用我们编写的这个插件了。

如何使用第三方插件

使用第三方插件之前,需要进入微信小程序开发者后台,在第三方服务里添加插件:

需要第三方同意你的申请后,你就可以开始使用第三方插件了。

使用第三方插件的时候,需要在 我们自己的小程序的 app.json 做如下配置:

{
  pages: [
    pages/index/index
  ],
  plugins: {
    myPlugin: {
      version: dev,
      provider: 填写申请通过的插件AppId
    }
 }
}

plugins: 配置的要使用的第三方插件列表。

插件列表配置好后,由于每个插件可能会有多个组件,所以需要我们在每个页面定义要使用到的组件,例如,在 index.js 中要使用 hgPlayer 这个组件,需要在 index.json 配置。配置好 index.json 后,就可以在 index.wxml 直接使用了。

推荐:《小程序开发教程》

以上就是如何开发小程序插件?的详细内容,更多请关注其它相关文章!


推荐阅读
  • 本文探讨了 RESTful API 和传统接口之间的关键差异,解释了为什么 RESTful API 在设计和实现上具有独特的优势。 ... [详细]
  • 本文详细介绍了Java编程语言中的核心概念和常见面试问题,包括集合类、数据结构、线程处理、Java虚拟机(JVM)、HTTP协议以及Git操作等方面的内容。通过深入分析每个主题,帮助读者更好地理解Java的关键特性和最佳实践。 ... [详细]
  • 本文将深入探讨PHP编程语言的基本概念,并解释PHP概念股的含义。通过详细解析,帮助读者理解PHP在Web开发和股票市场中的重要性。 ... [详细]
  • 本文详细介绍了如何使用 PHP 接收并处理微信支付的回调结果,确保支付通知能够被正确接收和响应。 ... [详细]
  • 使用JS、HTML5和C3创建自定义弹出窗口
    本文介绍如何结合JavaScript、HTML5和C3.js来实现一个功能丰富的自定义弹出窗口。通过具体的代码示例,详细讲解了实现过程中的关键步骤和技术要点。 ... [详细]
  • 本文详细介绍了如何使用PHP检测AJAX请求,通过分析预定义服务器变量来判断请求是否来自XMLHttpRequest。此方法简单实用,适用于各种Web开发场景。 ... [详细]
  • 本文介绍了如何使用PHP代码实现微信平台的媒体素材上传功能,详细解释了API接口的使用方法和注意事项,确保文件路径正确以避免常见的错误。 ... [详细]
  • 从零开始构建完整手机站:Vue CLI 3 实战指南(第一部分)
    本系列教程将引导您使用 Vue CLI 3 构建一个功能齐全的移动应用。我们将深入探讨项目中涉及的每一个知识点,并确保这些内容与实际工作中的需求紧密结合。 ... [详细]
  • 本文探讨了在通过 API 端点调用时,使用猫鼬(Mongoose)的 findOne 方法总是返回 null 的问题,并提供了详细的解决方案和建议。 ... [详细]
  • 本文详细介绍了在企业级项目中如何优化 Webpack 配置,特别是在 React 移动端项目中的最佳实践。涵盖资源压缩、代码分割、构建范围缩小、缓存机制以及性能优化等多个方面。 ... [详细]
  • 深入解析TCP/IP五层协议
    本文详细介绍了TCP/IP五层协议模型,包括物理层、数据链路层、网络层、传输层和应用层。每层的功能及其相互关系将被逐一解释,帮助读者理解互联网通信的原理。此外,还特别讨论了UDP和TCP协议的特点以及三次握手、四次挥手的过程。 ... [详细]
  • 本文详细介绍了网络存储技术的基本概念、分类及应用场景。通过分析直连式存储(DAS)、网络附加存储(NAS)和存储区域网络(SAN)的特点,帮助读者理解不同存储方式的优势与局限性。 ... [详细]
  • 探讨了如何解决Ajax请求响应时间过长的问题。本文分析了一个从服务器获取少量数据的Ajax请求,尽管服务器已经对JSON响应进行了缓存,但实际响应时间仍然不稳定。 ... [详细]
  • 阿里宝卡用户能否在UC浏览器极速版中享受免流量服务?
    本文详细介绍了UC浏览器极速版是否支持阿里宝卡的免流量功能,以及如何正确设置以确保免流量服务的正常使用。 ... [详细]
  • Java项目分层架构设计与实践
    本文探讨了Java项目中应用分层的最佳实践,不仅介绍了常见的三层架构(Controller、Service、DAO),还深入分析了各层的职责划分及优化建议。通过合理的分层设计,可以提高代码的可维护性、扩展性和团队协作效率。 ... [详细]
author-avatar
当初
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有