Empaqueter votre application

Suivez le tutoriel

Ceci est la partie 5 du tutoriel Electron.

1. Prérequis
2. Créer votre première application
3. Utiliser des scripts de préchargement
4. Ajouter des fonctionnalités
5. Empaqueter votre application
6. Publication et mise à jour

Objectifs

Dans cette partie du tutoriel, nous allons passer en revue les bases de l’empaquetage et de la distribution d'une application avec Electron Forge .

Utilisation d’Electron Forge

Electron n’inclut pas , dans ses modules de base, d’outil pour empaqueter et distribuer votre application. Une fois que votre application Electron est fonctionnelle en mode développement, vous allez devoir utiliser des outils supplémentaires pour créer une application packagée distribuable à vos utilisateurs (ce que l'on apelle communément un livrable ). De tels livrables peuvent être soit des programmes d’installation (par exemple.MSI sous Windows) soit des fichiers exécutables portables (par exemple, .app sur macOS).

Electron Forge est un outil tout-en-un gèrant l'empaquetage et la distribution des applications Electron. Sous le capot, il combine de nombreux outils Electron existants (par exemple, @electron/packager, @electron/osx-sign, electron-winstaller, etc.) sous une seule interface afin que vous n’ayez pas à vous soucier de leurs interconnexions.

Importation de votre projet dans Forge

Vous pouvez installer le CLI d'Electron Forge dans la section devDependencies de votre projet et importer votre projet existant avec un script de conversion très pratique.

npm

npm install --save-dev @electron-forge/cli
npx electron-forge import

Yarn

npm install --save-dev @electron-forge/cli
yarn dlx electron-forge import

Une fois le script de conversion terminé, Forge devrait avoir ajouté plusieurs scripts à votre fichier package.json .

package.json

  //...
  "scripts": {
    "start": "electron-forge start",
    "package": "electron-forge package",
    "make": "electron-forge make"
  },
  //...

Documentation du CLI

Pour plus d'informations sur make et d'autres API de Forge, consultez la documentation du CLI d'Electron Forge.

Vous remarquerez également que votre fichier package.json a maintenant quelques paquets supplémentaires installés sous devDependencies et un nouveau fichier forge.config.js qui exporte un objet de configuration. Vous devriez voir plusieurs "makers" (packages qui génèrent des distribuables regroupés) dans la configuration préremplie, avec un pour chaque plate-forme cible.

Création d’une distribution livrable

Pour créer un fichier distribuable, vous allez utiliser le nouveau script make de votre projet, qui exécutera la commande electron-forge make .

npm

npm run make

Yarn

yarn make

Cette commande make agit en deux temps:

1. Elle exécutera d’abord sous le capot electron-forge package , qui va regrouper le code de votre application avec le binaire d'Electron. Le code produit par ce paquetage est généré dans un dossier.
2. Ensuite ce dossier d'application empaqueté sera utilisé pour créer une distribution distincte pour chaque "maker" configuré.

Une fois le script exécuté, vous devriez voir un dossier out contenant à la fois le distribuable et un dossier contenant le code de l'application empaquetée.

macOS output example

out/
├── out/make/zip/darwin/x64/my-electron-app-darwin-x64-1.0.0.zip
├── ...
└── out/my-electron-app-darwin-x64/my-electron-app.app/Contents/MacOS/my-electron-app

Le distribuable dans le dossier out/make peut être démarré! Vous venez de créer votre première application Electron distribuable.

Formats distribuables

Electron Forge peut être configuré pour créer des distribuables sous différents formats spécifiques aux différents systèmes d'exploitation (par exemple, DMG, deb, MSI, etc.). Consultez la documentation des Makers pour voir toutes les options de configuration.

Création et Ajout d'icônes d'application

La définition d'icônes d'application personnalisées nécessite quelques ajouts à votre configuration. Consultez le tutoriel Les icônes avec Forge pour plus d'informations.

Empaquetage sans utiliser Electron Forge

Si vous souhaitez empaqueter manuellement votre code, ou si vous souhaitez simplement comprendre les mécanismes derrière l’empaquetage d’une application Electron, consultez la documentation complète de Empaquetage des Applications .

Important : signer votre code

Pour la distribution d'applications de bureau aux utilisateurs finaux, nous _recommandons fortement _ de signer le code de votre application Electron. La signature de code est une partie importante de la distribution des applications de bureau qui est obligatoire pour l’étape de mise à jour automatique que vous verrez dans la dernière partie du tutoriel.

La signature de code est une technologie de sécurité utilisée pour certifier qu'une application a bien été créée par une source clairement identifiée. Windows et macOS ont leur propre système de signature de code spécifique au système d’exploitation qui rendront difficile pour les utilisateurs de télécharger ou de lancer des applications non signées.

Sous macOS, la signature de code se fait au niveau de l’empaquetage de l’application. Sous Windows, ce sont les les programmes d’installation distribuables qui sont sont signés. Si vous disposez déjà de certificats de signature de code pour Windows et macOS, vous pouvez définir vos informations d’identification dans votre configuration Forge.

info

Pour plus d’informations sur la signature de code, consultez le guide Signature d’applications macOS dans la documentation Forge.

macOS

forge.config.js

module.exports = {
  packagerConfig: {
    osxSign: {},
    // ...
    osxNotarize: {
      tool: 'notarytool',
      appleId: process.env.APPLE_ID,
      appleIdPassword: process.env.APPLE_PASSWORD,
      teamId: process.env.APPLE_TEAM_ID
    }
    // ...
  }
}

Windows

forge.config.js

module.exports = {
  // ...
  makers: [
    {
      name: '@electron-forge/maker-squirrel',
      config: {
        certificateFile: './cert.pfx',
        certificatePassword: process.env.CERTIFICATE_PASSWORD
      }
    }
  ]
  // ...
}

Récapitulatif

Les applications Electron doivent être empaquetées pour être distribuées aux utilisateurs. Dans ce tutoriel, vous avez importé votre application dans Electron Forge que vous avez configuré pour empaqueter votre application et générer des installateurs.

Pour que votre application soit approuvée par le système de l’utilisateur, vous devez, en signant le code, certifier numériquementque que le distribuable est authentique et non altéré . Votre application peut être signée via Forge une fois que vous l’avez configurée pour utiliser les informations de votre certificat de signature de code.