How to Customize Build Scripts with Capacitor CLI

Capacitor CLI consente di personalizzare il processo di compilazione del tuo app per le piattaforme iOS, Android e web.

• Accelerare gli aggiornamenti: Invia le modifiche istantaneamente senza ritardi degli store di app.
• Controllare le distribuzioni: Annulla gli aggiornamenti o mira a specifiche fasce di utenti.
• Rendere la tua app più sicura: Utilizza l'encryption per proteggere gli aggiornamenti.
• Optimizzare le compilazioni: Regola le impostazioni per le esigenze specifiche delle piattaforme.

Riepilogo rapido delle principali funzionalità:

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

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

Introduzione Capacitor Configura

Default Build Process in Capacitor

Understanding how Capacitor handles its default build process is crucial if you want to customize it effectively. Below, we’ll break down the Capacitor CLI’s build process and its key configuration files.

Passaggi di build standard

Capacitor uses a step-by-step process to transform your web app into platform-specific builds. Here’s what happens during the default build process:

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: Consenti di configurare impostazioni specifiche per plugin, come le opzioni per lo schermo di benvenuto.

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

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

• The webDir Il capacitor.config.json tells Capacitor where to locate your compiled web assets for inclusion in the native builds.
• indica a capacitor.config.jsontells __CAPGO_KEEP_0__ cap sync dove trovare i tuoi asset web compilati per l'inclusione nei build nativi.

After making changes to

Dopo aver apportato modifiche a

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

, è necessario eseguire

to ensure your native projects are updated. capacitor.config.json per assicurare che i tuoi progetti nativi siano aggiornati.

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

Qui sono alcune impostazioni chiave che puoi modificare:

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

Creazione di Script NPM

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 : Utilizza questi per compiti come la configurazione dell'ambiente o l'invio di notifiche quando il build è completato. postbuild: Comandi specifici per piattaforma per la creazione di app Android o iOS.
• build:platformPuoi portare l'automazione ancora più lontano aggiungendo hook di build.

Eseguire la configurazione dei hook di build

Eseguire la configurazione dei hook di build

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

• Validare le richieste prima che il costruzione inizi
• Trasformare gli asset durante il processo
• Attivare le notifiche in punti chiave
• Aggiornare automaticamente i numeri di versione
• Eseguire test automatizzati senza problemi

Questa approccio ti dà una maggiore flessibilità e controllo sul ciclo di vita di costruzione intero.

Personalizzazione di Costruzione Avanzata

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 delle piattaforme in modo efficace.

Variabili di Ambiente

Configura le variabili di ambiente creando separati .env file per ambiente:

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

Configura quindi lo script di build per caricare il file appropriato in base all'ambiente:

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 consentono di personalizzare le costruzioni per ogni piattaforma, garantendo una maggiore fluidità delle distribuzioni.

Ulteriori consigli per l'ottimizzazione dei tuoi costruzioni includono:

• L'utilizzo di aggiornamenti parziali per risparmiare tempo durante le distribuzioni
• Configurazione dell'errore di tracciamento per identificare rapidamente gli issue
• Creazione di sistemi di canale per le versioni di testing beta
• Abilitazione della crittografia end-to-end per una distribuzione sicura

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

Problemi e soluzioni dei script di costruzione

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

Correggi gli errori comuni

Molti problemi di script di costruzione 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

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

BUILD_ENV=development
CAPACITOR_PLATFORM=ios
BUILD_TYPE=debug

Fallimenti di costruzione specifici della piattaforma

Per gli errori di firma Android, utilizza questo comando:

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

Per gli problemi di profilo di provisioning iOS, prova questo:

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

Dopo aver applicato le 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 avviare la costruzione.

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

• Debugging dello Script di Costruzione: Aggiungi script dettagliati 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. Verifica i file di configurazione prima di avviare il processo.
• Prova con diverse versioni di
• Node.js Verifica che i requisiti specifici del sistema siano soddisfatti. __CAPGO_KEEP_0__
• __CAPGO_KEEP_0__
• Tenete d'occhio sulle prestazioni di costruzione per eventuali miglioramenti.

Capgo Caratteristiche di costruzione

Capgo porta le script di costruzione al livello successivo con la distribuzione automatizzata, migliorando l'efficienza e semplificando il processo.

Aggiornamenti veloci 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 globalmente.

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

Automazione della costruzione

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

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

Standard di sicurezza

Capgo pone l'accento sulla sicurezza con un robusto framework che include:

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

Caratteristiche di controllo versione.

• Opzioni di rollback istantanee.
• Tracciamento delle versioni 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 le squadre che hanno bisogno di ulteriori misure di sicurezza, Capgo offre anche soluzioni self-hosted con configurazioni personalizzabili.

Capgo’s sistema di canali rende la distribuzione degli aggiornamenti flessibile. I sviluppatori possono targetizzare gruppi di utenti specifici con versioni diverse, perfetto per i test beta o i rilasci graduati.

Riepilogo.

Panoramica dei passaggi di costruzione.

Gli script di costruzione personalizzati consentono deployment automatizzati e coerenti utilizzando gli 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.

Benefici di Capgo.

Capgo semplifica il deployment, avendo già consegnato con successo oltre 23,5 milioni di aggiornamenti su 750 app di produzione. [1]La sua sistema di aggiornamento parziale 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 su canali flessibile.

Continua da Come personalizzare i script di build con Capacitor CLI

Se stai utilizzando Come personalizzare i script di build con Capacitor CLI per pianificare l'automazione CI/CD, connettilo con Capgo CI/CD per il flusso di lavoro del prodotto in Capgo CI/CD, Capgo Costruzioni native per il flusso di lavoro del prodotto in Capgo Costruzioni native, Capgo Integrazioni for the product workflow in Capgo Integrations, 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.