Passer au contenu principal

Capacitor Guide de contribution des plugins

Apprenez comment contribuer efficacement aux plugins Capacitor avec un guide complet sur la configuration, les normes de codage, les tests et la documentation.

Martin Donadieu

Martin Donadieu

Spécialiste du contenu

Guide de contribution des plugins Capacitor

Capacitor les plugins connectent les technologies web aux fonctionnalités de dispositifs natifs, permettant le développement d'applications cross-plateformes. Ce guide vous aide :

  • Configurez votre environnement: Les outils comme Node.js, Xcode, et Android Studio sont essentiels.
  • Suivez les normes Code: Utilisez TypeScript, Swift, et Kotlin avec des conventions de nommage cohérentes et une gestion des erreurs.
  • Testez Thoroughement: Écrivez des tests unitaires pour JavaScript, iOS et Android pour garantir la fiabilité.
  • Documentez Clairement: Utilisez JSDoc et des fichiers README pour une adoption facile.
  • Soumettre une Demande de Tirage: Assurez-vous d'une qualité élevée code, d'un test et d'une documentation avant de contribuer.

Guide Complet sur les Logiciels Libres - Comment Contribuer

Configuration de l'Environnement de Développement

La mise en place d'un environnement de développement approprié est essentielle pour un développement de plugin efficace. Un setup bien préparé permet un codage, un test et une mise en ligne de vos plugins sans heurts.

Outils et Compétences dont Vous aurez Besoin

Avant de commencer, assurez-vous d'avoir les outils suivants installés :

CatégorieExigences
Outils de BaseNode.js (LTS), npm 6+, Git
IDE/ÉditeursVisual Studio Code ou votre éditeur préféré
Développement iOSXcode, SwiftLint, Pods Cocoa
Développement AndroidAndroid Studio, Android SDK, JDK

Vous devriez également être à l'aise avec TypeScript pour le développement web et soit Swift (pour iOS) ou Java/Kotlin (pour Android) pour les tâches de développement natif [1][2].

Configuration de la Répertoire Monorepo

La Capacitor plugins l'écosystème repose sur une structure de répertoire monorepo. Cette approche garantit que votre travail est conforme aux normes de la communauté dès le début.

  1. Forker et Cloner le Répertoire
    Commencez par forker le répertoire des plugins Capacitor sur GitHub. Ensuite, clonez votre répertoire forké :

    git clone https://github.com/your-username/capacitor-plugins.git
    cd capacitor-plugins
    npm install
  2. Installer les Dépendances et Construire
    Exécutez la commande suivante pour installer tout ce dont vous avez besoin et construire les plugins :

    npm run build
  3. Configure la version de contrôle
    Utilisez des branches de fonctionnalités pour vos modifications et maintenez votre fork synchronisé avec le dépôt upstream.

Préparation des plateformes natives

Pour le développement cross-plateforme, vous devrez configurer les environnements iOS et Android.

Pour iOS :

  • Téléchargez Xcode depuis l'App Store Mac.

  • Installez les outils de ligne de commande en utilisant :

    xcode-select --install
  • Installez CocoaPods avec :

    sudo gem install cocoapods
  • Configurez un compte développeur Apple et les certificats nécessaires.

  • Utilisez SwiftLint (facultatif) pour maintenir code qualité.

Pour Android :

  • Installez Android Studio ainsi que la dernière SDK et une appareil virtuel.
  • Assurez-vous d'avoir un JDK installé.
  • Configurez correctement l'SDK Android dans Android Studio.

Une fois ces plateformes configurées, vous serez prêt à suivre les pratiques de codage établies et à plonger dans le développement de plugins.

Guide des normes Code

Maintenant que votre environnement de développement est configuré, suivez ces lignes directrices pour créer des plugins faciles à maintenir et à utiliser.

Conformité au Guide de style

Le Capacitor écosystème de plugins exige des normes de codage strictes à l'aide d'outils comme ESLint, Prettier, et SwiftLint. Voici un aperçu rapide des formats requis :

ComponentFormat
VariablesdeviceInfo (camelCase)
ClassesBatteryManager (PascalCase)
MethodsgetLanguageCode() (camelCase)
ConstantsMAX_RETRY_COUNT (SNAKE_CASE)

Les plugins devraient utiliser TypeScript pour une meilleure sécurité des types et des fonctionnalités ES6+ telles que async/awaitEn outre, suivez les conventions de codage spécifiques aux plateformes pour Swift (iOS) et Kotlin (Android).

Gestion des erreurs et types

La gestion cohérente des erreurs est cruciale pour la compatibilité cross-plateforme. Voici un exemple :

async checkPermissions(): Promise<PermissionStatus> {
  try {
    const result = await this.implementation.checkPermissions();
    return result;
  } catch (error) {
    throw new Error(`Permission check failed: ${error.message}`);
  }
}

Pour la sécurité des types :

  • Utilisez des interfaces ciblées conçues pour des cas d'utilisation spécifiques.
  • Appliquez des types de union pour les variations spécifiques au plateforme.

Code Documentation

Une bonne documentation est essentielle pour rendre votre plugin accessible et facile à utiliser. Suivez ces pratiques :

  1. API Documentation: Écrivez des commentaires JSDoc qui fonctionnent avec @capacitor/docgen. Par exemple :
/**
 * @description Get the device's current battery level
 * @returns Promise with the battery level percentage
 */
async getBatteryLevel(): Promise<{ level: number }>;
  1. Structure du README : Incluez des informations essentielles comme les étapes d'installation, les instructions de configuration, les exigences spécifiques au plateforme, des exemples d'utilisation et une référence détaillée API.

Une documentation bien écrite assure que votre plugin est facile à adopter et contribue à la communauté Capacitor plus large.

sbb-itb-f9944d2

Guide de test de plugin

Le test de Capacitor implique de se concentrer sur quelques domaines critiques pour s'assurer de la fonctionnalité et de la fiabilité.

Tests de pont natif

Le test de pont natif s'assure d'une communication appropriée entre JavaScript et code. Pour commencer, configurez votre environnement de test avec des frameworks conçus pour chaque plateforme.

Voici un exemple de Jest test unitaire pour le côté JavaScript :

// Example of a Jest unit test for the JavaScript bridge
describe('DeviceInfo Plugin', () => {
  test('getBatteryLevel returns valid percentage', async () => {
    const result = await DeviceInfo.getBatteryLevel();
    expect(result.level).toBeGreaterThanOrEqual(0);
    expect(result.level).toBeLessThanOrEqual(100);
  });
});

Pour tester du côté natif, utilisez XCTest pour iOS et JUnit pour Android. Voici un exemple pour Android :

@Test
fun testBatteryLevel() {
    val plugin = DeviceInfo()
    val result = plugin.getBatteryLevel()
    assertTrue(result.level in 0..100)
}

Une fois que vous avez confirmé que la fonctionnalité de pont de base fonctionne comme prévu, passez à la test de workflows complets de l'utilisateur.

Tests de plugin complets

To vous assurer que votre plugin fonctionne bien dans différents scénarios, testez diverses catégories :

Catégorie de testAires de concentration clés
Tests d'intégration Fonctionnalité cross-plateforme
Tests de performanceUtilisation des ressources et temps de réponse
Tests de sécuritéGestion des données et vérifications d'autorisation

Pour les plugins avec des fonctionnalités complexes, simulez des scénarios réalistes de l'utilisation. Par exemple, si vous testez un plugin DeviceInfo, vérifiez :

  • Téléchargements réussis dans différentes conditions de réseau
  • Rapports de progression précis
  • Utilisation de la mémoire pendant les transferts de fichiers importants

Test de mise à jour OTA avec Capgo

Interface de tableau de bord de mise à jour en temps réel de Capgo

Les outils open-source de Capgo facilitent la mise en œuvre et le test de mises à jour rapides. Voici comment les utiliser :

  1. Configurer canaux de mise à jour comme dev, étape, et production.
  2. Automatiser les déploiements avec des outils CI/CD.
  3. Envoyer des mises à jour instantanément.
  4. Surveiller les performances et les problèmes via le Capgo tableau de bord.

Pour les déploiements étalés, Capgo vous permet de limiter les mises à jour à une petite proportion d'utilisateurs. Par exemple, vous pouvez déployer une nouvelle version à 25 % d'utilisateurs tous les 24 heures :

// Example configuration for staged rollout
{
  "plugin": "camera-plugin",
  "version": "1.2.0",
  "rollout": {
    "percentage": 25,
    "interval": "24h"
  }
}

Cette approche étalée aide à identifier les problèmes en amont en exploitant les retours de la communauté avant une mise en production complète.

Processus de demande de tirage

Une fois que vous avez soigneusement testé vos modifications, suivez ces étapes pour soumettre votre demande de tirage :

Liste de vérification de soumission de PR

Avant de soumettre, assurez-vous d'avoir couvert ces domaines clés :

CatégorieCe que vérifier
Code Qualité- Assurez-vous que les implémentations Swift/Kotlin correspondent à la API web.
Test- Ajoutez des tests unitaires pour toute nouvelle fonctionnalité.
- Vérifiez que les contrôles de pipeline CI/CD sont réussis.
Documentation- Mettez à jour la README, la documentation en ligne et le CHANGELOG en fonction de vos besoins.

Règles de la Communauté

Lors de la collaboration, suivez ces meilleures pratiques :

  • Répondez rapidement aux commentaires des réviseurs.
  • Gardez les discussions centrées sur les détails techniques.
  • Utilisez la fonctionnalité de proposition de GitHub pour proposer code modifications.
  • Soumettez des demandes de tirage de code petites et centrées sur une fonctionnalité ou un problème à la fois.

Pour des modifications plus importantes, il est une bonne idée de créer un problème avant et de discuter de votre approche. L'équipe de Capacitor se fie aux Actions de GitHub pour les contrôles automatisés, et tous les contrôles doivent passer avant que votre demande de tirage de code puisse être examinée.

Guide d'intégration de Capgo

Si votre plugin implique des mises à jour en temps réel, assurez-vous qu'il fonctionne de manière fluide avec Capgo avant de le soumettre :

  1. Version Control
    Utilisez une versionnement semantique claire pour votre plugin, et documentez toutes les modifications dans le changelog. Capgo’s système aide à suivre l’adoption de la version sur les appareils des utilisateurs.

  2. CI/CD Integration
    Intégrez Capgo dans votre pipeline CI/CD pour automatiser les déploiements d’actualisation.

  3. Update Monitoring
    Surveillez les taux de réussite des déploiements et assurez-vous de respecter les lignes directrices des magasins d’applications.

Summary

Pour faire une contribution significative avec votre plugin, il est important de suivre le processus établi et de respecter les normes de la communauté. Cela inclut la tenue de Capacitor’s lignes directrices de codage et la vérification approfondie de votre travail.

Le checklist PR met en évidence la nécessité de soumissions de haute qualité. Si votre plugin prend en charge les mises à jour en direct, l’intégration avec Capgo (comme mentionné précédemment) peut vous aider à publier des mises à jour rapidement sans attendre les approbations des magasins d’applications.

Une fois votre PR est fusionné, restez impliqué en suivant les problèmes et en publiant des mises à jour de version. L’interaction régulière avec la communauté, la maintenance constante et le suivi des mises à jour de Capacitor assureront que votre plugin reste utile et pertinent.

Prenez en compte les retours d'informations des utilisateurs et mettez à jour en conséquence. Cette démarche continue contribue à maintenir la qualité globale de l'écosystème et garde votre plugin précieux pour les développeurs.

Continuez de Capacitor Guide de contribution du plugin

Si vous utilisez Capacitor Guide de contribution du plugin pour planifier le travail de plugin natif, connectez-le à Capgo Répertoire des plugins pour le flux de travail du produit dans Capgo Répertoire des plugins, Capacitor Plugins par Capgo pour les détails d'implémentation dans Capacitor Plugins par Capgo, Ajouter ou Mettre à jour les Plugins pour les détails d'implémentation dans Ajouter ou Mettre à jour les Plugins, Alternatives de plugins Enterprise Ionic pour le flux de produit dans les alternatives Ionic Enterprise Plugin Capgo Builds natifs pour le flux de produit dans Capgo Builds natifs.

Mises à jour en temps réel pour les applications Capacitor

Lorsqu'un bug du niveau web est en ligne, expédiez la correction à travers Capgo au lieu d'attendre des jours pour l'approbation de la boutique d'applications. Les utilisateurs reçoivent la mise à jour en arrière-plan tandis que les modifications natives restent dans la voie de revue normale.

Démarrer Maintenant

Dernières actualités de notre Blog

Capgo vous donne les meilleures informations dont vous avez besoin pour créer une application mobile véritablement professionnelle.