Come personalizzare i script di costruzione con Capacitor CLI

Capacitor CLI ti consente di personalizzare il processo di costruzione del tuo app per le piattaforme iOS, Android e web. Modificando i script di costruzione, puoi:

• Accelerare gli aggiornamenti: Invia modifiche istantaneamente senza ritardi degli store di app.
• Controlla le distribuzioni: Annulla gli aggiornamenti o mira a gruppi di utenti specifici.
• Sicurizza l'app: Utilizza l'encryption per proteggere gli aggiornamenti.
• Optimizza le compilazioni: Regola le impostazioni per le esigenze specifiche delle piattaforme.

Panoramica rapida delle principali funzionalità:

• File di configurazione: Utilizza capacitor.config.json e package.json gestire le impostazioni di costruzione.
• Script personalizzati: Aggiungi compiti prebuild e postbuild per l'automazione.
• Hooks di costruzione: Esegui code durante le fasi specifiche del processo di costruzione.
• Variabili di ambiente: Semplifica i costruzioni specifiche dell'ambiente con .env file.

Capgo, uno strumento di distribuzione, migliora questo processo con aggiornamenti automatici, tracciamento delle versioni e ottimizzazione della prestazione globale. Continua a leggere per imparare a configurare e personalizzare i tuoi script di costruzione per massimizzare l'efficienza.

Introduzione Capacitor Configura

Processo di costruzione predefinito in Capacitor

Capire come Capacitor gestisce il suo processo di costruzione predefinito è fondamentale se desideri personalizzarlo efficacemente. Di seguito, ci occuperemo di analizzare il processo di costruzione e i file di configurazione chiave del Capacitor CLI.

Passaggi di costruzione standard

Capacitor utilizza un processo passo dopo passo per trasformare la tua app web in costruzioni specifiche per piattaforma. Ecco cosa accade durante il processo di costruzione predefinito:

File di configurazione principali

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: Un identificatore univoco per la tua app.
• appName: Il nome della tua app.
• webDir: Specifies where Capacitor should look for the web assets (e.g., dist).
• plugins: Consente di configurare impostazioni specifiche dei plugin, come le opzioni per lo schermo di benvenuto.

package.json
Questo file include script di compilazione e dipendenze che influenzano il processo di compilazione:

{
  "scripts": {
    "build": "npm run build:web && cap sync",
    "build:web": "vite build",
    "cap:build": "cap build"
  }
}

• La webDir impostazione in capacitor.config.json informa Capacitor dove trovare i tuoi asset web compilati per l'inclusione nei build nativi.
• Dopo aver apportato modifiche a capacitor.config.json, è necessario eseguire cap sync per assicurarsi che i progetti nativi siano aggiornati.

Proseguendo, esploreremo come modificare questi impostazioni per personalizzare ulteriormente i build.

Modifica dei Script di Build

Puoi modificare il processo di build di default di Capacitor per adattarlo meglio alle tue esigenze di progetto. Ecco come fare:

Impostazioni del File di Configurazione

Puoi modificare il processo di build modificando il capacitor.config.json file. Ecco un esempio di configurazione:

{
  "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
  }
}

Ecco alcune impostazioni chiave che puoi modificare:

• webDir: Specifica dove sono ubicati i tuoi asset web compilati.
• server: Configura il server di sviluppo, inclusi hostname e autorizzazioni di navigazione.
• android/ios: Consente impostazioni di costruzione specifiche per piattaforma, come dettagli del keystore per Android o opzioni di provisioning per iOS.

Creazione di NPM Scripts

Per semplificare il tuo workflow, aggiungi script NPM personalizzati al tuo package.json file. Ecco un esempio:

{
  "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 e postbuild: Utilizza questi per compiti come la configurazione dell'ambiente o l'invio di notifiche quando il build è completato.
• build:platform: Comandi specifici per piattaforma per la costruzione di app Android o iOS.

Puoi prendere l'automazione ancora più lontano aggiungendo script di build.

Setup di Build Hooks

Per un controllo più avanzato, utilizza gli hook di build per eseguire code personalizzati in punti specifici del processo di costruzione. Ecco un esempio di 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;

Con gli hook di build, puoi:

• Verifica le richieste prima che inizi la costruzione
• Trasforma gli asset durante il processo
• Attiva le notifiche in punti chiave
• Aggiorna automaticamente i numeri di versione
• Esegui test automatizzati senza problemi

Questa approccio ti offre maggiore flessibilità e controllo sul ciclo di vita della costruzione

Personalizzazione avanzata della costruzione

Lavorando su progetti più grandi, l'ottimizzazione del processo di costruzione può fare una grande differenza. Ecco come gestire le costruzioni specifiche dell'ambiente e le personalizzazioni di piattaforma in modo efficace

Variabili di ambiente

Configura le variabili di ambiente creando file separati per ogni ambiente: .env Poi, configura lo script di costruzione per caricare il file appropriato in base all'ambiente:

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

Then, configure your build script to load the appropriate file based on the environment:

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'
          }
        }
      }
    }
  }
});

Puoi ulteriormente regolare questi impostazioni per adattarle alle esigenze specifiche della piattaforma.

Costruzioni specifiche della piattaforma

Per personalizzare le costruzioni per Android e iOS, utilizza la seguente struttura:

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
    }
  }
};

Queste configurazioni ti consentono di personalizzare le costruzioni per ogni piattaforma, garantendo una maggiore fluidità delle distribuzioni.

Ulteriori consigli per l'ottimizzazione dei build includono:

• Utilizzare aggiornamenti parziali per risparmiare tempo durante le distribuzioni
• Configurare la tracciatura degli errori per identificare velocemente gli issue
• Creare sistemi di canali per le versioni di testing beta
• Abilitando la crittografia end-to-end per una distribuzione sicura

Quando associato a strumenti come Capgo per l'analisi e gli aggiornamenti sicuri, queste tecniche ti danno più controllo sul tuo processo di distribuzione [1].

Problemi e soluzioni del file di build

Quando si lavora con configurazioni di build personalizzate, risolvere gli errori velocemente è cruciale per mantenere il processo di build in esecuzione senza problemi

Correggi gli errori comuni

Molti problemi di script di build derivano da problemi di configurazione dell'ambiente o di dipendenze. Ecco come affrontare alcuni dei più comuni:

Variabili di ambiente mancanti

Se incontri un errore del tipo:

error: Cannot find environment configuration for BUILD_ENV

Puoi risolverlo creando un .env.local file nella directory radice del tuo progetto. Ecco un esempio:

BUILD_ENV=development
CAPACITOR_PLATFORM=ios
BUILD_TYPE=debug

Fallimenti di build specifici della piattaforma

Per gli errori di firma Android, utilizza questo comando:

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

Per problemi di profilo di provisioning iOS, prova questo:

npx cap build ios --configuration=release --type=development

Dopo l'applicazione delle correzioni, assicurati che le tue modifiche siano solide eseguendo test di build approfonditi.

Test dei Script di Build

Una volta risolti gli errori, verifica i tuoi script di build con questi passaggi:

• Verifica Automatica: Esegui comandi chiave per confermare che il processo di build funziona come previsto.

npm run build
npx cap sync
npx cap copy

• Validazione dell'ambiente: Controlla le variabili di ambiente mancanti prima di iniziare il build.

const requiredVars = ['BUILD_ENV', 'KEYSTORE_PATH'];
requiredVars.forEach(varName => {
  if (!process.env[varName]) {
    throw new Error(`Missing required env var: ${varName}`);
  }
});

• Debug dei Script di Build: Aggiungi dettagliati script per catturare potenziali problemi durante la costruzione.

{
  "scripts": {
    "build:debug": "NODE_ENV=development npx cap build --verbose",
    "build:release": "NODE_ENV=production npx cap build --verbose"
  }
}

Ulteriori consigli per la prova:

• Usa Container Docker per isolare le costruzioni. Valuta i file di configurazione prima di avviare il processo.
• Prova con diverse versioni di
• Node.js . Conferma che sono soddisfatte le richieste specifiche del piattaforma.
• Tieni d'occhio le prestazioni della costruzione per possibili miglioramenti.
• __CAPGO_KEEP_0__

Capgo Sviluppa Funzionalità

Capgo porta i script di build al livello successivo con il deployment automatizzato, migliorando l'efficienza e semplificando il processo.

Aggiornamenti Rapidi delle App

Capgo’s prestazioni di aggiornamento sono impressionanti:

• 95% degli utenti attivi ricevono aggiornamenti entro 24 ore.
• 82% di successo per la consegna degli aggiornamenti in tutto il mondo.
• Un tempo di risposta medio di API di 434ms a livello globale.

La piattaforma utilizza aggiornamenti parziali, il che significa che solo le modifiche vengono scaricate. Questo approccio riduce l'uso di banda e accelera il processo di aggiornamento. Inoltre, tutto il processo di build è completamente automatizzato, risparmiando tempo e sforzo.

Automazione dei processi di costruzione

Capgo funziona in modo trasparente con le principali piattaforme CI/CD, offrendo una varietà di integrazioni:

La configurazione di un build automatico tipicamente costa circa €300 al mese, il che è molto più conveniente rispetto alle soluzioni tradizionali che possono arrivare fino a €6.000 all'anno.

Standard di Sicurezza

Capgo priorizza la sicurezza con un robusto framework che include:

• Encryptazione end-to-end dei pacchetti di aggiornamento.
• Gestione delle chiavi sicura.
• Conformità con le linee guida di Apple e Google.

Caratteristiche di Controllo delle Versioni

• Opzioni di rollback istantanee.
• Tracciamento della versione di distribuzione.
• Gestione del canale di aggiornamento per le rilasci in fase di staging.

Questo framework di sicurezza è stato rigorosamente testato su centinaia di applicazioni aziendali. Per i team che hanno bisogno di ulteriore sicurezza, Capgo offre anche soluzioni auto-hosted con configurazioni personalizzabili.

Il sistema dei canali di Capgo rende la distribuzione degli aggiornamenti flessibile. I sviluppatori possono mirare a specifiche gruppi di utenti con versioni diverse, perfetto per il testing beta o i rilasci graduati.

Riepilogo

Panoramica dei passaggi di costruzione

I script di costruzione personalizzati consentono deployment automatizzati e coerenti utilizzando le funzionalità di hook di costruzione, le variabili di ambiente e i comandi specifici della piattaforma. Questi processi creano una solida base per miglioramenti di deployment resi possibili con Capgo.

Vantaggi di Capgo

Capgo semplifica la distribuzione, avendo con successo distribuito oltre 23,5 milioni di aggiornamenti su 750 app di produzione [1]. Il suo sistema di aggiornamenti parziali riduce sia l'uso di banda che il tempo di distribuzione.

La piattaforma fornisce aggiornamenti veloci, ottimizzazione della prestazione globale, crittografia end-to-end per la sicurezza e un sistema di distribuzione basato sui canali flessibile. Questo setup supporta aggiornamenti mirati, testing beta e conformità con le linee guida degli store di app, mantenendo un solido framework di sicurezza.

Continua da Come personalizzare i script di costruzione con Capacitor CLI

Se stai utilizzando Come personalizzare i script di costruzione con Capacitor CLI per pianificare l'automazione CI/CD, connettilo con Capgo automazione CI/CD per il flusso di lavoro del prodotto in Capgo automazione CI/CD, Capgo Costruzioni native per il flusso di lavoro del prodotto in Capgo Costruzioni native, Capgo Integrazioni per il flusso di lavoro del prodotto in Capgo Integrazioni, Integrazione CI/CD per i dettagli di implementazione in Integrazione CI/CD, e GitHub Azioni di integrazione per i dettagli di implementazione in GitHub Azioni di integrazione.