L'objectif d'électron est de construire un exécutable à partir du code d'une application web de type SPA, par exemple écrite en vuejs. Pour ce faire, electron embarque dans l'exécutable un moteur d'interprétation JS, qui va afficher le résultat dans une fenêtre classique, telle que celle qu'on crée dans une application Java ou Qt.
Pour créer une application electron à partir d'un projet vuejs, la première étape est d'inclure le plugin electron pour vuejs au projet :
vue add electron-builder
Au cours de l'installation, il est demandé quelle version d'electron doit être utilisée. Généralement, on prend la plus récente, sauf raison impérieuse.
Après l'installation, la différence la plus notable est l'apparition d'un fichier background.js
dans le répertoire src
. Ce fichier contient les instructions permettant notamment de créer la fenêtre principale et de "lancer" la page initiale de l'application.
Pour faire un test en mode développement, il suffit de lancer :
npm run electron:serve
Une fenêtre est créée, relativement similaire à celle d'un navigateur, puisque l'on a accès à l'inspecteur, et que l'on peut suivre des URLs externes.
Pour créer l'exécutable, il faut lancer :
npm run electron:build
Le résultat est placé dans le répertoire dist_electron
, avec potentiellement plusieurs versions d'exécutables :
Sous linux, il est possible de configurer electron pour qu'il produise des fichiers .deb
.