Zum Hauptinhalt springen

Wie man Skripte für die Erstellung von Capacitor CLI anpasst

Erhalten Sie Informationen darüber, wie Sie Ihre Skripte für die Erstellung von Capacitor CLI anpassen können, um effiziente Bereitstellungen und zugeschnittene App-Updates auf verschiedenen Plattformen zu ermöglichen

Wie man Skripte für die Erstellung von Capacitor CLI anpasst

Capacitor CLI ermöglicht Ihnen, das Build-Prozess Ihres Apps für iOS, Android und Web-Plattformen anzupassen. Durch das Anpassen von Build-Skripten können Sie:

  • Updates beschleunigen: Änderungen sofort ohne App-Store-Verzögerungen durchführen.
  • Deployments steuern: Updates rückgängig machen oder bestimmte Benutzergruppen auswählen.
  • Die App sichern: Verschlüsselungen für Updates verwenden.
  • Builds optimieren: Einstellungen für Plattform-spezifische Bedürfnisse anpassen.

Zusammenfassung der Schlüsselfunktionen:

  • Konfigurationsdateien: Verwenden Sie capacitor.config.json und package.json um die Build-Einstellungen zu verwalten.
  • Benutzerdefinierte Skripte: Fügen Sie Vor- und Nachbauaufgaben für die Automatisierung hinzu.
  • Build-Hooks: Führen Sie code während bestimmter Phasen des Build-Prozesses aus.
  • Umgebungsvariablen: Vereinfachen Sie umgebungsabhängige Builds mit .env Dateien.

Capgoeine Bereitstellungs-Tool, verbessert diesen Prozess mit automatischen Updates, Versionsverfolgung und globaler Leistungsoptimierung. Lesen Sie weiter, um zu erfahren, wie Sie Ihre Build-Skripte einrichten und anpassen können, um die Effizienz zu maximieren.

Vorstellung Capacitor Konfigurieren Sie

Capacitor Framework-Dokumentationswebsite

Standardbauprozess in Capacitor

Um den Standardbauprozess von Capacitor effektiv anzupassen, ist es wichtig, zu verstehen, wie Capacitor seinen Standardbauprozess handhabt. Im Folgenden werden wir den Standardbauprozess von Capacitor CLI und dessen Schlüsselkonfigurationsdateien aufschlüsseln.

Standardbauschritte

Capacitor verwendet einen Schritt-für-Schritt-Prozess, um Ihre Webanwendung in plattform-spezifische Builds umzuwandeln. Hier ist, was während des Standardbauprozesses passiert:

Phase Beschreibung Ausgabe
Web Build Verwendet Ihre Framework-Tools, um Web-Assets zu kompilieren Optimierter Web-Bundle
Copy Assets Überträgt Web-Assets in native Plattform-Ordner Plattform-spezifische Asset-Verzeichnisse
Native Build Ausführt plattform-spezifische Build-Befehle Bereit zum Bereitstellen Binärdateien
Überprüfung Überprüft die Build-Integrität und Abhängigkeiten Build-Status und Warnungen

Hauptkonfigurationsdateien

Two key configuration files shape how Capacitor handles your builds:

capacitor.config.json
This is the core configuration file for your Capacitor project. It sets important parameters for your builds:

{
  "appId": "com.example.app",
  "appName": "MyApp",
  "webDir": "dist",
  "bundledWebRuntime": false,
  "plugins": {
    "SplashScreen": {
      "launchShowDuration": 3000
    }
  }
}
  • appId: Eine eindeutige Identifikationsnummer für Ihre App.
  • appName: Der Name Ihrer App.
  • webDir: Specifies where Capacitor should look for the web assets (e.g., dist).
  • plugins: Ermöglicht die Konfiguration von Plugin-eigenen Einstellungen, wie z.B. Optionen für das SplashScreen.

package.json
Diese Datei enthält Build-Skripte und Abhängigkeiten, die den Build-Prozess beeinflussen:

{
  "scripts": {
    "build": "npm run build:web && cap sync",
    "build:web": "vite build",
    "cap:build": "cap build"
  }
}
  • Die webDir Einstellung in capacitor.config.json erzählt Capacitor Ihnen, wo Ihre kompilierten Web-Assets für die Einbindung in die nativen Builds zu finden sind.
  • Nachdem Sie Änderungen an vorgenommen haben, capacitor.config.jsonmüssen Sie cap sync ausführen,

um sicherzustellen, dass Ihre nativen Projekte aktualisiert werden.

Als nächstes werden wir Ihnen zeigen, wie Sie diese Einstellungen anpassen können, um Ihre Builds noch weiter anzupassen.

You can tweak Capacitor’s default build process to better suit your project needs. Here’s how:

Sie können die Standardbuild-Prozesse von __CAPGO_KEEP_0__ an Ihre Projektbedürfnisse anpassen. Hier ist, wie Sie das tun können:

Einstellungen für die Konfigurationsdatei capacitor.config.json Sie können den Build-Prozess, indem Sie die

{
  "appId": "com.example.app",
  "webDir": "www",
  "server": {
    "hostname": "localhost",
    "androidScheme": "https",
    "iosScheme": "https",
    "allowNavigation": ["*.example.com"]
  },
  "android": {
    "buildOptions": {
      "keystorePath": "release.keystore",
      "keystorePassword": "mypassword",
      "keystoreAlias": "release",
      "keystoreAliasPassword": "mypassword"
    }
  },
  "ios": {
    "scheme": "App",
    "automaticProvisioning": true
  }
}

Datei bearbeiten. Hier ist ein Beispielkonfiguration:

  • webDirHier sind einige Schlüssel-Einstellungen, die Sie anpassen können:
  • server: Konfiguriert den Entwicklungs-Server, einschließlich Hostname und Navigationsberechtigungen.
  • android/ios: Zulässt plattformspezifische Build-Einstellungen, wie z.B. Keystore-Daten für Android oder Bereitstellungsoptionen für iOS.

Creating NPM Scripts

To streamline your workflow, add custom NPM scripts to your package.json Datei. Hier ist ein Beispiel:

{
  "scripts": {
    "prebuild": "node ./scripts/prepare-env.js",
    "build": "npm run build:web && cap sync",
    "build:web": "vite build",
    "build:ios": "cap build ios --release",
    "build:android": "cap build android --release",
    "postbuild": "node ./scripts/notify-completion.js"
  }
}
  • prebuild und postbuild: Verwenden Sie diese für Aufgaben wie die Einrichtung der Umgebung oder die Benachrichtigung bei Abschluss der Build-Ausführung.
  • build:platform: Plattformspezifische Befehle für die Erstellung von Android- oder iOS-Anwendungen.

Sie können die Automatisierung sogar weiter vorantreiben, indem Sie Build-Hooks hinzufügen.

Build-Hooks-Einstellungen

For more advanced control, use build hooks to execute custom code at specific points during the build process. Here’s an example setup in capacitor.config.ts:

import { CapacitorConfig } from '@capacitor/cli';

const config: CapacitorConfig = {
  appId: 'com.example.app',
  plugins: {
    CapacitorHooks: {
      beforeBuild: async () => {
        console.log('Running pre-build tasks...');
        // Add your pre-build tasks here
      },
      afterBuild: async () => {
        console.log('Running post-build tasks...');
        // Add your post-build tasks here
      }
    }
  }
};

export default config;

Mit Build-Hooks können Sie:

  • Überprüfen Sie die Anforderungen vor dem Start des Builds
  • Transformieren Sie Assets während des Prozesses
  • Auslösen Sie Benachrichtigungen an wichtigen Punkten
  • Aktualisieren Sie die Versionsnummern automatisch
  • Führen Sie automatisierte Tests reibungslos durch

Diese Vorgehensweise bietet Ihnen mehr Flexibilität und Kontrolle über den gesamten Build-Lebenszyklus

Erweiterte Build-Anpassungen

Wenn Sie bei größeren Projekten an einem größeren Projekt arbeiten, kann die Feinabstimmung Ihres Build-Prozesses einen großen Unterschied machen. Hier erfahren Sie, wie Sie Umgebungsabhängige Builds und Plattformanpassungen effektiv handhaben können.

Umgebungsvariablen

Legen Sie Umgebungsvariablen fest, indem Sie separate .env Dateien für jede Umgebung erstellen:

  • .env.development
  • .env.staging
  • .env.production

Konfigurieren Sie dann Ihren Build-Skript, um die entsprechende Datei auf der Grundlage der Umgebung zu laden:

import { defineConfig } from '@capacitor/cli';

export default defineConfig({
  ios: {
    buildConfig: {
      environment: process.env.BUILD_ENV || 'development',
      configurations: {
        development: {
          signing: {
            debug: true,
            automaticProvisioning: true
          }
        },
        production: {
          signing: {
            release: true,
            provisioningProfile: 'dist/profile.mobileprovision'
          }
        }
      }
    }
  }
});

Sie können diese Einstellungen weiter anpassen, um sie den Plattform-spezifischen Anforderungen anzupassen.

Plattform-spezifische Builds

Um Builds für Android und iOS anzupassen, verwenden Sie die folgende Struktur:

const platformConfig = {
  android: {
    buildType: process.env.BUILD_TYPE || 'debug',
    keystoreConfig: {
      path: process.env.KEYSTORE_PATH,
      password: process.env.KEYSTORE_PASSWORD,
      alias: process.env.KEYSTORE_ALIAS
    }
  },
  ios: {
    scheme: process.env.APP_SCHEME || 'App',
    xcodePreferences: {
      automaticSigning: false,
      developmentTeam: process.env.DEVELOPMENT_TEAM
    }
  }
};

Diese Konfigurationen ermöglichen Ihnen, Builds für jede Plattform anzupassen, um eine glattere Bereitstellung zu gewährleisten.

Funktion Android iOS
Debugsymbol ProGuard Mappingdateien dSYM-Dateien
Buildvarianten debug, release, staging debug, release
Code Signierung Keystore-Verwaltung Provisioning-Profil-Verwaltung
Asset-Verwaltung res/drawable-Optimierung Asset-Kataloge

Zusätzliche Tipps zur Optimierung Ihrer Builds umfassen:

  • Verwendung von Teilaktualisierungen, um Zeit während der Bereitstellung zu sparen
  • Einrichten von Fehlermeldungen, um Probleme schnell zu identifizieren
  • Erstellen von Kanal-Systemen für die Beta-Testversion
  • End-to-End-Verschlüsselung für sichere Verteilung aktivieren

Wenn Sie diese Techniken mit Werkzeugen wie Capgo für Analytics und sichere Updates kombinieren, haben Sie mehr Kontrolle über Ihren Bereitstellungsprozess [1].

Probleme und Lösungen bei Build-Skripten

Wenn Sie mit benutzerdefinierten Build-Konfigurationen arbeiten, ist es wichtig, Fehler schnell zu lösen, um den Build-Prozess reibungslos laufen zu lassen

Gemeinsame Fehler beheben

Viele Probleme bei Build-Skripten resultieren aus Umgebungs- oder Abhängigkeitsproblemen. Hier erfahren Sie, wie Sie einige häufige Probleme lösen können

Verschollene Umgebungsvariablen

Wenn Sie einen Fehler wie diesen begegnen:

error: Cannot find environment configuration for BUILD_ENV

Sie können ihn beheben, indem Sie ein .env.local Datei in der Wurzel Ihres Projekts erstellen. Hier ist ein Beispiel:

BUILD_ENV=development
CAPACITOR_PLATFORM=ios
BUILD_TYPE=debug

Plattformspezifische Build-Fehler

Für Android-Signierungsfehler verwenden Sie diesen Befehl:

npx cap build android --keystorePassword=$KEYSTORE_PASSWORD --keystoreAlias=$KEYSTORE_ALIAS

Für iOS-Provisionierungsprofilprobleme, probieren Sie Folgendes:

npx cap build ios --configuration=release --type=development
__CAPGO_KEEP_0__ Fehlerart Häufige Ursache
Lösung Signierungs-Konfiguration Fehlende Keystore-Daten KEYSTORE_PATH Setzen
und Anmeldeinformationen Build-Umgebung Ungewisse Variablen .env Erstellen Sie plattform-spezifische
Abhängigkeiten Versionen stimmen nicht überein aktualisieren package.json und synchronisieren

Nachdem Sie die Reparaturen angewendet haben, stellen Sie sicher, dass Ihre Änderungen stabil sind, indem Sie gründliche Build-Tests durchführen.

Testen Sie die Build-Skripte

Nachdem die Fehler behoben wurden, überprüfen Sie Ihre Build-Skripte mit diesen Schritten:

  • Automatisierte Verifizierung: Führen Sie wichtige Befehle aus, um sicherzustellen, dass der Build-Prozess wie erwartet funktioniert.
npm run build
npx cap sync
npx cap copy
  • Umweltvalidierung: Überprüfen Sie fehlende Umgebungsvariablen, bevor Sie den Build starten.
const requiredVars = ['BUILD_ENV', 'KEYSTORE_PATH'];
requiredVars.forEach(varName => {
  if (!process.env[varName]) {
    throw new Error(`Missing required env var: ${varName}`);
  }
});
  • Debugging von Build-Skripten: Fügen Sie detaillierte Skripte hinzu, um potenzielle Probleme während der Erstellung zu erkennen.
{
  "scripts": {
    "build:debug": "NODE_ENV=development npx cap build --verbose",
    "build:release": "NODE_ENV=production npx cap build --verbose"
  }
}

Zusätzliche Tipps für die Testung:

  • Verwenden Sie Docker Container, um Builds zu isolieren.
  • Überprüfen Sie die Konfigurationsdateien, bevor Sie den Prozess starten.
  • Testen Sie mit mehreren Node.js Versionen.
  • Stellen Sie sicher, dass die Plattform-spezifischen Anforderungen erfüllt sind.
  • Beachten Sie die Leistung der Builds, um mögliche Verbesserungen zu erkennen.

Capgo Build Features

Capgo Live Update Dashboard Interface

Capgo bringt Build-Skripte auf das nächste Level mit automatisierter Bereitstellung, was die Effizienz erhöht und den Prozess vereinfacht.

Quick App Updates

Capgo’s Update-Leistung ist beeindruckend:

  • 95% der aktiven Benutzer erhalten Updates innerhalb von 24 Stunden.
  • 82% Erfolgsrate für die weltweite Lieferung von Updates.
  • Ein durchschnittlicher API-Antwortzeit von 434ms weltweit.

Die Plattform verwendet partielle Updates, was bedeutet, dass nur die Änderungen heruntergeladen werden. Diese Vorgehensweise reduziert den Bandbreitenverbrauch und beschleunigt den Update-Prozess. Zudem ist der gesamte Build-Prozess vollautomatisiert, was Zeit und Mühe spart.

Automatisierung von Build-Prozessen

Capgo funktioniert reibungslos mit den wichtigsten CI/CD-Plattformen und bietet eine Vielzahl von Integrationsmöglichkeiten:

CI/CD-Plattform Integrationseigenschaften Vorteile
GitHub-Aktionen Automatisierte Builds, Deploy-Trigger Kontinuierliche Bereitstellung
GitLab CI Pipeline-Automatisierung, Versionskontrolle Gestrafter Workflow
Jenkins Benutzerdefinierte Workflows, Build-Hooks Skalierbar für Unternehmen

Die Einrichtung eines automatischen Build-Prozesses kostet typischerweise etwa 300 US-Dollar pro Monat, was deutlich budgetfreundlicher ist im Vergleich zu traditionellen Lösungen, die bis zu 6.000 US-Dollar jährlich kosten.

Sicherheitsstandards

Capgo legt den Schwerpunkt auf Sicherheit mit einem robusten Framework, das umfasst:

  • End-to-End-Verschlüsselung für Update-Pakete.
  • Sichere Schlüsselverwaltung.
  • Einhaltung der Richtlinien von Apple und Google.

Versionierungssteuerung

  • Instant rollbackmöglichkeiten.
  • Versionenverfolgung für die Bereitstellung.
  • Updatekanalverwaltung für die Veröffentlichung von Testversionen.

Dieses Sicherheitsframework wurde sorgfältig auf Hunderten von Unternehmenanwendungen getestet. Für Teams, die zusätzliche Sicherheit benötigen, bietet Capgo auch selbst gehostete Lösungen mit anpassbaren Konfigurationen.

Capgo's Kanalsystem ermöglicht flexible Updateverteilung. Entwickler können spezifische Benutzergruppen mit verschiedenen Versionen ansprechen, ideal für Beta-Tests oder schrittweise Veröffentlichungen.

Zusammenfassung

Übersicht der Build-Schritte

Benutzerdefinierte Build-Skripte ermöglichen automatisierte und konsistente Bereitstellungen, indem sie Build-Hooks, Umgebungsvariablen und plattformspezifische Befehle nutzen. Diese Prozesse schaffen eine solide Grundlage für die Verbesserung der Bereitstellungen, die mit Capgo möglich sind.

Capgo-Vorteile

Capgo vereinfacht die Bereitstellung, indem es erfolgreich über 23,5 Millionen Updates an 750 Produktionsanwendungen geliefert hat. [1]Sein teilweiser Update-System reduziert sowohl den Bandbreitenverbrauch als auch die Bereitstellungsdauer.

Die Plattform bietet schnelle Updates, globale Leistungsoptimierung, Ende-zu-Ende-Verschlüsselung für die Sicherheit und ein flexibles Kanal-basiertes Verteilungssystem. Diese Konfiguration unterstützt zielgerichtete Updates, Beta-Tests und die Einhaltung von Richtlinien der App-Stores, während ein starkes Sicherheitsframework beibehalten wird.

Gehe weiter von Wie man Build-Skripte mit Capacitor CLI anpasst

Wenn Sie __CAPGO_KEEP_0__ verwenden Wie man Build-Skripte mit Capacitor CLI anpasst um die CI/CD-Automatisierung zu planen, verbinden Sie es mit __CAPGO_KEEP_0__ CI/CD Capgo CI/CD um den Produktworkflow in Capgo CI/CD zu erstellen Capgo Native Builds um den Produktworkflow in Capgo Native Builds zu erstellen Capgo Integrations um den Produktworkflow in Capgo Integrations zu erstellen CI/CD-Integration um die Implementierungsdetails in CI/CD-Integration zu erstellen GitHub Actions Integration for the implementation detail in GitHub Actions Integration.

Live-Updates für Capacitor-Anwendungen

Wenn ein Bug im Web-Schicht lebt, schicken Sie die Reparatur durch Capgo anstatt Tage zu warten, bis die App-Store-Zulassung vorliegt. Die Benutzer erhalten die Aktualisierung im Hintergrund, während native Änderungen im normalen Review-Prozess bleiben.

Unterstützung durch Menschen von Martin

Los geht's jetzt

Neueste von unserem Blog

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