Comment développer un mini plug-in de programme ?

Comment développer des plug-ins de mini-programmes ? L'article suivant vous présentera un tutoriel sur le développement et l'utilisation des mini-programmes WeChat. Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer. J'espère qu'il sera utile à tout le monde.

Récemment, le mini-programme WeChat a publié une mise à jour majeure de fonctionnalités pour prendre en charge l'utilisation et le développement de plug-ins. Dès que la nouvelle est sortie, de petits développeurs de programmes ont afflué sur le site et ont commencé à se spécialiser dans le développement de plug-ins. Il est prévisible qu'un certain nombre de plug-ins de haute qualité seront bientôt lancés. Du point de vue d'un développeur, le problème le plus préoccupant est comment développer des mini-plug-ins de programme WeChat. Tout d'abord, vous devez comprendre les mini-plug-ins de programme.

Qu'est-ce qu'un mini plug-in de programme WeChat ?

Les plug-ins sont un ensemble de bibliothèques de codes encapsulées par js et des composants personnalisés ne peuvent pas être utilisés seuls ou prévisualisés. Ils doivent être intégrés dans d'autres applications de mini-programmes avant de pouvoir être utilisés. . C'est la même chose que la dépendance de NPM et la bibliothèque de dépendances de Maven.

Cependant, la différence entre les plug-ins et la gestion des dépendances NPM et Maven est que les plug-ins ont des interfaces API et des listes de noms de domaine indépendantes, et ne sont pas limités par la liste de noms de domaine du mini-programme lui-même. (Les bibliothèques sur lesquelles NPM s'appuie ne peuvent pas faire de demandes de données de tiers) ; les plug-ins doivent être approuvés par Tencent avant de pouvoir être utilisés (NPM ne nécessite pas d'examen par Tencent, vous devez demander à un tiers pour utiliser un plug-in tiers) ; -ins (vous n'avez pas besoin de demander à un tiers pour utiliser des bibliothèques tierces via NPM ). Ainsi, à l’avenir, les plug-ins pourraient être présentés sous forme de services par des tiers, et non plus simplement comme une bibliothèque de codes.

Comment développer le plug-in du mini-programme WeChat ?

Téléchargez les derniers outils de développement du mini-programme WeChat, ouvrez les outils de développement et entrez dans le projet du mini-programme.

Cliquez sur le bouton "Créer" dans le coin inférieur droit pour créer un plug-in

AppId et. L'AppId du mini-programme WeChat précédent est le même. Vous devez créer un nouveau plug-in de mini-programme WeChat dans le backend du développeur WeChat :

WeChat Le nom du plug-in du mini programme doit également être unique. Une fois l'application terminée, l'AppId du plug-in peut être obtenu. Après avoir renseigné le nom et l'AppID du plug-in, vous pouvez accéder au projet du mini programme.

Dans le fichier project.config.json, on voit le code comme suit :

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

miniprogramRoot : Configurez le répertoire racine du mini programme Vous pouvez utiliser le mini programme pour tester l'écrit. plug-in

pluginRoot : Le répertoire racine où se trouve le code associé au plug-in

compileType : Le type de compilation du projet, qui doit être configuré en plugin Lors du téléchargement du code, il sera téléchargé sur le serveur Tencent sous la forme d'un plug-in.

Dans le fichier plugin/plugin.json, le code est le suivant :

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

publicComponents : Configurez les composants que le plug-in peut fournir au petit programme utilisé. définir de nombreux composants Les composants et les composants font référence les uns aux autres, mais l'applet ne peut utiliser que les composants configurés dans publicComponents.

main : Définissez le fichier d'entrée, et définissez dans le fichier d'entrée index.js les interfaces que le mini programme peut utiliser des plug-ins.

Dans le fichier plugin/index.js, le code est le suivant :

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

Dans plugin/index.js, les interfaces de lancement externes sont définies comme getData et setData lorsque l'applet utilise. ce plug-in, seules ces deux interfaces fournies par le plug-in peuvent être utilisées, et les autres interfaces (ou méthodes) du plug-in ne peuvent pas être utilisées par l'applet.

Après avoir terminé la configuration ci-dessus, vous pouvez commencer à écrire le code du composant dans plugin/components.

Une fois le code écrit, faites attention à la configuration dans le fichier plugin/plugin.json. Après l'avoir configuré, je peux télécharger le code du plug-in sur le serveur Tencent, accéder au backend du développeur de l'applet WeChat et le soumettre pour examen. Une fois que Tencent a approuvé l'examen, l'applet tiers peut utiliser le plug-in que nous avons écrit.

Comment utiliser des plug-ins tiers

Avant d'utiliser des plug-ins tiers, vous devez accéder au backend du développeur du mini programme WeChat et ajouter des plug-ins. ins dans le service tiers :

Remplissez l'AppId du plug-in tiers, cliquez sur le bouton Ajouter, et votre application apparaîtra dans le mini plug-in de programme du compte de l'autre partie > Gestion des applications,

Une fois que le tiers doit accepter votre application, vous pouvez commencer à utiliser le plug-in tiers.

Lors de l'utilisation de plug-ins tiers, nous devons effectuer la configuration suivante dans app.json de notre propre mini-programme :

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

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

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

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

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!