Zum Hauptinhalt springen

Wie man Abhängigkeiten in Capacitor-Plugins hinzufügt

Lernen Sie, die Abhängigkeitsverwaltung in Capacitor-Plugins über Plattformen hinweg zu optimieren, mit praktischen Schritten und besten Praktiken.

Martin Donadieu

Martin Donadieu

Content-Marketing-Manager

Wie man Abhängigkeiten in Capacitor-Plugins hinzufügt

Abhängigkeiten zu __CAPGO_KEEP_0__-Plugins hinzufügen Capacitor Plugins können überwältigend erscheinen, aber es ist einfacher, wenn man sie in klare Schritte aufteilt. Hier ist, was Sie wissen müssen:

  1. Verstehen Sie die Werkzeuge:

  2. Konfigurieren Sie Ihre Entwicklungsumgebung:

  3. Starten Sie Ihr Capacitor-Plugin-Projekt:

    • Verwenden npm init @capacitor/plugin eine neue Erweiterung erstellen.
  4. JavaScript-Abhängigkeiten hinzufügen:

    • Verwenden Sie npm install für Produktions- und Entwicklungsabhängigkeiten.
    • Aktualisieren Sie package.json um Peer-Abhängigkeiten wie @capacitor/core.
  5. Plattform-spezifische Abhängigkeiten verwalten:

    • iOS: Konfigurieren Sie CocoaPods oder SPM mit Bibliotheken wie Alamofire oder SwiftyJSON.
    • Android: Verwenden Sie Gradle, um Abhängigkeiten wie Gson oder AppCompat hinzuzufügen.
  6. Leistung optimieren:

    • Versionsnummern festlegen, Abhängigkeiten überprüfen und Konflikte lösen, um Stabilität sicherzustellen.
  7. Verwenden Sie Werkzeuge wie Capgo für Live-Updates:

    • Aktualisierungen sofort ohne App-Store-Überprüfung durchführen.

Schnelle Vergleich der Werkzeuge:

PlattformWerkzeugBeispielhafte Abhängigkeit
JavaScriptnpmnpm install lodash --save
iOSCocoaPods/SPMpod 'Alamofire', '~> 5.6.4'
AndroidGradleimplementation 'com.google.code.gson:gson:2.10.1'

Warum es zählt: Effektive Abhängigkeitsverwaltung sichert die reibungslose Funktion Ihres Plugins auf allen Plattformen, spart Zeit und vermeidet Fehler. Lassen Sie uns tiefer in die Schritte eintauchen.

Wie Sie ein Capacitor Plugin für iOS/Android erstellen

Capacitor Framework Dokumentationswebsite

Ihre Entwicklungsumgebung einrichten

Vorbereiten Sie Ihre Konfiguration mit den notwendigen Werkzeugen, um Capacitor-Plugin Abhängigkeiten effektiv zu handhaben.

Erforderliche Entwicklungstools

Hier ist eine Liste der Werkzeuge, die Sie benötigen:

WerkzeugVersionZweck
Node.js16.0.0+JavaScript-Interpreter-Umgebung
npm8.0.0+Paketverwaltung
Xcode14.0+iOS-Entwicklung (nur Mac)
Android StudioElectric Eel+Android-Entwicklung
CocoaPods1.11.0+Verwaltung von iOS-Abhängigkeiten
JDK11+Android-Bauwerkzeuge

Ein neues Plugin starten

Verwenden Sie die Capacitor CLI zum Starten Ihres Plugin-Projekts. Dies umfasst die Einrichtung von Plattformen und die Namensgebung Ihres Plugins im umgekehrten Domänenformat (z.B. com.mycompany.plugin):

  1. Führen Sie folgenden Befehl aus:
    npm init @capacitor/plugin
  2. Wählen Sie Ihre Zielplattformen (iOS/Android).
  3. Zuweisen Sie einem Namen für Ihr Plugin im umgekehrten Domänenformat.

Schritte zur Projekt-Einrichtung

  1. Aktualisieren package.json

    Ändern Sie Ihr package.json um Folgendes zu enthalten:

    {
      "capacitor": {
        "ios": {
          "src": "ios"
        },
        "android": {
          "src": "android"
        }
      },
      "peerDependencies": {
        "@capacitor/core": "^5.0.0"
      }
    }
  2. Plattform-spezifische Einrichtung

    • Für iOS, stellen Sie sicher, dass Ihr Podfile Folgendes enthält:

      platform :ios, '13.0'
      use_frameworks!
    • Für Android, überprüfen Sie Ihren build.gradle enthält:

      android {
          compileSdkVersion 33
          defaultConfig {
              minSdkVersion 22
          }
      }
  3. Umgebungseinstellungen einrichten

    Konfigurieren Sie die folgenden Umgebungsvariablen für Ihre Entwicklungstools:

    VariableZweckBeispielwert
    ANDROID_HOMEAndroid-SDK-Ort/Users/username/Library/Android/sdk
    JAVA_HOMEJDK-Installationspfad/Library/Java/JavaVirtualMachines/jdk-11.0.12.jdk/Contents/Home
    XCODE_SELECTXcode-Befehlszeilenwerkzeuge/Applications/Xcode.app/Contents/Developer

Sobald Ihr Projekt eingerichtet ist, seid Ihr bereit, auf die Verwaltung von JavaScript-Abhängigkeiten zuzugehen.

JavaScript-Abhängigkeiten

Die effektive Verwaltung von JavaScript-Abhängigkeiten ist entscheidend für eine stabile Plugin-Leistung.

npm Paketinstallation

npm

Um Abhängigkeiten zu installieren, verwenden Sie die folgenden Befehle:

# Add a production dependency
npm install lodash --save

# Add a development dependency
npm install @types/lodash --save-dev

Stellen Sie sicher, dass Sie die Peer-Abhängigkeiten manuell in Ihrem package.json Datei einfügen. Testen Sie alle Abhängigkeiten, um die Kompatibilität auf beiden Web- und Native-Plattformen zu bestätigen.

Verwaltung von package.json

Hier ist ein Beispiel package.json Konfiguration:

{
  "name": "my-capacitor-plugin",
  "version": "1.0.0",
  "dependencies": {
    "lodash": "^4.17.21"
  },
  "devDependencies": {
    "@types/lodash": "^4.14.195",
    "@capacitor/core": "^5.0.0"
  },
  "peerDependencies": {
    "@capacitor/core": "^5.0.0"
  }
}

Um Konsistenz zu gewährleisten, passen Sie die Versionsnummern der Abhängigkeiten entsprechend an:

Abhängigkeits-TypBeispielVerwendungsfall
Exakt”5.0.0”Für kritische Abhängigkeiten, die eine bestimmte Version erfordern
Pfeil”^5.0.0”Ermöglicht kleine Aktualisierungen und Patches
Tilgungszeichen”~5.0.0”Beschränkt Aktualisierungen auf Patches nur

Verwendung von JavaScript-Bibliotheken

Wenn Sie Bibliotheken importieren, konzentrieren Sie sich darauf, die Bundle-Größe zu reduzieren:

// Import only the required function
import { isEqual } from 'lodash';

export class MyPlugin {
  async compare(options: { value1: any, value2: any }): Promise<boolean> {
    return isEqual(options.value1, options.value2);
  }
}

Stellen Sie außerdem sicher, dass Sie eine ordnungsgemäße Fehlerbehandlung und Typüberprüfung durchführen:

import { Plugin } from '@capacitor/core';
import { validate } from 'your-validation-library';

@Plugin({
  name: 'MyPlugin',
  platforms: ['web', 'ios', 'android']
})
export class MyPlugin {
  async validateData(data: unknown): Promise<void> {
    try {
      if (!validate(data)) {
        throw new Error('Invalid data format');
      }
      // Continue processing if valid
    } catch (error) {
      throw new Error(`Validation failed: ${error.message}`);
    }
  }
}

Als Nächstes erfahren Sie, wie Sie Plattform-spezifische Abhängigkeiten für iOS handhaben.

iOS-Abhängigkeiten

In diesem Abschnitt wird erklärt, wie Sie native iOS-Abhängigkeiten verwalten. Capacitor-PluginsEinmal, dass Sie Ihre JavaScript-Abhängigkeiten eingerichtet haben, ist der nächste Schritt die Handhabung von native iOS-Abhängigkeiten.

CocoaPods Setup

CocoaPods

Beginnen Sie mit der Initialisierung von CocoaPods in Ihrem iOS-Verzeichnis:

cd ios
pod init

Dann aktualisieren Sie Ihr Plugin.podspec mit den folgenden Konfigurationen:

Pod::Spec.new do |s|
  s.name = 'MyCapacitorPlugin'
  s.version = '1.0.0'
  s.summary = 'Your plugin description'
  s.platform = :ios, '13.0'
  s.dependency 'Capacitor'
  # Include your iOS dependencies here
  s.dependency 'Alamofire', '~> 5.6.4'
end

Podfile-Konfiguration

Nach der Initialisierung von CocoaPods, konfigurieren Sie das Podfile, um Capacitor und weitere dritte Bibliotheken einzuschließen:

platform :ios, '13.0'
use_frameworks!

def capacitor_pods
  pod 'Capacitor', :path => '../../node_modules/@capacitor/ios'
  pod 'CapacitorCordova', :path => '../../node_modules/@capacitor/ios'
end

target 'Plugin' do
  capacitor_pods
  # Add third-party dependencies
  pod 'KeychainAccess', '~> 4.2.2'
  pod 'SwiftyJSON', '~> 5.0.1'
end

target 'PluginTests' do
  capacitor_pods
end

Hier sind einige gängige Abhängigkeitskonfigurationsmuster:

BeschränkungstypBeispielVerwendungszweck
Exakte Versionpod 'KeychainAccess', '4.2.2'Wenn eine genaue Kontrolle erforderlich ist, wie bei Sicherheitskomponenten
Kleine Versionpod 'Alamofire', '~> 5.6'Für stabile APIs, die möglicherweise Patch-Updates erhalten
Große Versionpod 'SwiftyJSON', '> 5.0'Wenn Flexibilität bei Updates akzeptabel ist

Abhängigkeiten von Swift-Paketen

Wenn Sie CocoaPods nicht verwenden möchten, ist der Swift Package Manager (SPM) eine gute Alternative. Fügen Sie SPM-Abhängigkeiten direkt in Xcode mit der folgenden Konfiguration in Ihrem Package.swift Datei:

// Package.swift
dependencies: [
    .package(url: "https://github.com/Alamofire/Alamofire.git", .upToNextMajor(from: "5.6.4")),
    .package(url: "https://github.com/SwiftyJSON/SwiftyJSON.git", from: "5.0.1")
]

Um SPM-Abhängigkeiten in Ihrem Plugin code zu verwenden, importieren Sie sie und integrieren Sie sie wie erforderlich. Zum Beispiel:

import Capacitor
import Alamofire

@objc(MyPlugin)
public class MyPlugin: CAPPlugin {
    @objc func makeRequest(_ call: CAPPluginCall) {
        AF.request("https://api.example.com/data").response { response in
            // Process the response
            call.resolve([
                "data": response.data
            ])
        }
    }
}

Diese Methode ermöglicht es Ihnen, zwischen CocoaPods und Swift Package Manager basierend auf Ihren Projektanforderungen zu wählen.

Android-Abhängigkeiten

Stellen Sie die Android-Abhängigkeiten ein, um eine glatte native Integration sicherzustellen. Hier erfahren Sie, wie Sie die Abhängigkeiten für Ihr Capacitor-Plugin verwalten.

Gradle Abhängigkeiten

Gradle Build Tool Interface

Fügen Sie die folgenden Konfigurationen Ihrem build.gradle Datei:

android {
    defaultConfig {
        minSdkVersion 22
        targetSdkVersion 33
    }
}

dependencies {
    implementation "androidx.appcompat:appcompat:1.6.1"
    implementation "com.google.code.gson:gson:2.10.1"
    implementation "org.jetbrains.kotlin:kotlin-stdlib:1.8.20"
    implementation project(':capacitor-android')
}

Definieren Sie zusätzliche Versionen im buildscript Block:

buildscript {
    ext {
        androidxCoreVersion = '1.10.1'
        kotlinVersion = '1.8.20'
    }
}

Sobald die Abhängigkeiten konfiguriert sind, stellen Sie sicher, dass Sie die notwendigen Repositories einrichten.

Repository-Konfiguration

In Ihrem Projekt-Level build.gradle, fügen Sie die erforderlichen Maven-Repositories ein:

allprojects {
    repositories {
        google()
        mavenCentral()
        maven { url "https://jitpack.io" }
    }
}

Wenn Sie benutzerdefinierte oder private Maven-Repositories verwenden, fügen Sie Anmeldeinformationen wie folgt hinzu:

maven {
    url "https://maven.example.com/releases"
    credentials {
        username = project.findProperty("mavenUsername") ?: System.getenv("MAVEN_USERNAME")
        password = project.findProperty("mavenPassword") ?: System.getenv("MAVEN_PASSWORD")
    }
}

Mit den Repositories eingerichtet, beheben Sie etwaige Abhängigkeitskonflikte, die auftreten können.

Kompatibilitätsprobleme beheben

Um Abhängigkeitskonflikte zu handhaben, wenden Sie Versionserweiterungen in Ihrem build.gradle:

configurations.all {
    resolutionStrategy {
        force "org.jetbrains.kotlin:kotlin-stdlib:1.8.20"
        force "androidx.core:core-ktx:1.10.1"
    }
}

Hier sind Strategien zur Auflösung von häufigen Abhängigkeitsproblemen:

ProblemtypStrategieBeispiel
VersionenkonfliktZwingen Sie eine bestimmte Versionforce 'com.google.code.gson:gson:2.10.1'
Mehrere VersionenExkludieren Sie ein Modulexclude group: 'org.json', module: 'json'
Transitive IssuesVerwenden Sie strikte Versionenstrictly 'androidx.core:core-ktx:1.10.1'

Beispielsweise können Sie konkurrierende Module wie folgt ausschließen:

dependencies {
    implementation('library:name:1.0.0') {
        exclude group: 'com.conflicting.dependency'
    }
}

Schließlich optimieren Sie Ihren Build-Prozess, indem Sie Caching und parallele Ausführung in gradle.properties:

org.gradle.caching=true
org.gradle.parallel=true
org.gradle.jvmargs=-Xmx2048m

Capgo Integration

Capgo Live Update Dashboard Interface

Das Kombinieren von Capgo mit native und JavaScript-Abhängigkeitsverwaltung macht das Aktualisieren Ihres Plugins schneller und einfacher.

Über Capgo

Capgo ist eine Live-Update-Plattform, die für Capacitor-Plugins und -Apps konzipiert ist. Mit über 23,5 Millionen Updates, die in 750 Produktanwendungen ausgeliefert wurden, ermöglicht Capgo es Entwicklern, Updates für Abhängigkeiten und Capacitor sofort zu pushen - ohne dass eine App-Store-Überprüfung erforderlich ist. Updates werden mit Ende-zu-Ende-Verschlüsselung gesichert und erfüllen sowohl die Apple- als auch die Android-Kompatibilitätsstandards. [1], Capgo allows developers to push updates for dependencies and code instantly - no app store review required. Updates are secured with end-to-end encryption and meet both Apple and Android compliance standards.

Capgo Update Features

Capgo vereinfacht die Verwaltung von Plugin-Abhängigkeiten mit diesen Funktionen:

FunktionWas es tutSchlüsselmetrik
Live-UpdatesPush-Updates in Minuten95% Benutzer-Update-Rate innerhalb von 24 Stunden
Teilweise UpdatesHerunterladen nur geänderter Dateien434ms Durchschnittszeit für API-Antworten
VersionskontrolleVerwaltung mehrerer Versionen82% globale Erfolgsrate
Kanal-SystemZiel spezifische BenutzergruppenMehrere Bereitstellungskanäle unterstützt

Quelle: [1]

Capgo funktioniert reibungslos mit CI/CD-Tools wie GitHub Actions, GitLab CI und Jenkins, automatisiert Abhängigkeitsaktualisierungen und sichert konsistente Pluginversionen. Diese Tools erleichtern die Integration von Capgo in Ihren Workflow.

Einrichten von Capgo

Folgen Sie diesen Schritten, um Capgo in Ihr Projekt zu integrieren:

  1. Installieren Sie das Capgo-CLI

    Führen Sie den folgenden Befehl in Ihrem Terminal aus:

    npx @capgo/cli init
  2. Konfigurieren Sie die Aktualisierungspräferenzen

    Verwenden Sie das Capgo-Dashboard, um Bereitstellungskanäle und -präferenzen einzurichten. Beide Cloud-Hosted- und Self-Hosted-Konfigurationen werden unterstützt.

  3. Update-Logik hinzufügen

    Hinzufügen Sie diesen code zu Ihrer Haupt-Plugin-Datei, um Updates zu aktivieren:

    import { Capgo } from '@capgo/capacitor-updater';
    
    // Initialize Capgo
    const capgo = new Capgo({
      appId: 'YOUR_APP_ID',
      channel: 'production'
    });
    
    // Check for updates
    await capgo.checkForUpdate();

“Wir praktizieren agiles Entwicklung und @Capgo ist mission-kritisch bei der ständigen Lieferung an unsere Benutzer!” - Rodrigo Mantica

Capgo bietet auch eine Analyse-Tabelle für Echtzeit-Einsichten in die Erfolgsraten von Updates und die Aktivität der Benutzer. Funktionen wie eine Rücksetzung mit einem Klick und Fehler-Tracking helfen dabei, Probleme schnell zu lösen, und sorgen dafür, dass Ihre Plugin-Updates reibungslos laufen.

Zusammenfassung

Prozess-Überprüfung

Die Verwaltung von Abhängigkeiten für Capacitor-Plugins beinhaltet die Abstimmung der native Komponenten (iOS und Android) mit ihren JavaScript-Komponenten, um eine glatte Integration zu gewährleisten. Dieser Prozess umfasst Plattform-spezifische Einstellungen und die Verwaltung von JavaScript-Paketen, um die beste Leistung zu erzielen. Durch die Ausführung der aufgeführten Schritte können Sie eine stabile und effiziente Plugin-Funktionalität aufrechterhalten.

Best Practices

Um Abhängigkeiten effektiv zu verwalten, sollten Sie diese Praktiken berücksichtigen:

PraxisVorteilImplementierung
Version FixierungVerhindert unerwartete ProblemeVerwenden Sie feste Versionen in package.json
Plattform-IsolierungMinimiert KonflikteSeparieren Sie native Abhängigkeiten
Regelmäßige UpdatesBessere SicherheitAnwenden Sie kritische Patches rechtzeitig
AbhängigkeitsprüfungRisiken erkennenAusführen npm audit häufig

Mit lebendigen Aktualisierungstools wie Capgo können diese Praktiken weiter vereinfacht und verbessert werden, indem Echtzeitaktualisierungen ermöglicht werden.

Capgo Vorteile

Capgo vereinfacht den Abhängigkeitsmanagementprozess und liefert eine starke Leistung. Es erreicht einen beeindruckenden 95% Benutzeraktualisierungsrate innerhalb von 24 Stunden und hält eine globale API Antwortzeit von 434ms [1]. Mit Ende-zu-Ende-Verschlüsselung stellt es sicher, dass sichere Aktualisierungen erfolgen, die sowohl den Richtlinien von Apple als auch von Android entsprechen. Für Teams, die mehrere Pluginversionen verwalten, ermöglicht Capgo's Kanal-System gezielte Bereitstellungen für bestimmte Benutzergruppen.

Hier ist ein schneller Überblick über die Leistung von Capgo:

MetrikWert
Globale API Antwortzeit434ms
Update-Erfolgsrate82%
Benutzeraktualisierungsrate (24 Stunden)95%
Live-Updates für Capacitor-Apps

Wenn ein Fehler im Web-Schicht lebt, liefern Sie die Reparatur über Capgo anstatt Tage auf die Genehmigung des App-Store zu warten. Die Benutzer erhalten die Aktualisierung im Hintergrund, während native Änderungen im normalen Review-Path bleiben.

Los geht's jetzt

Aktuelle Beiträge aus unserem Blog

Capgo bietet Ihnen die besten Einblicke, die Sie benötigen, um eine wirklich professionelle mobile App zu erstellen.