Electron-packager emballe le frontal dans une application

Récemment, je travaille sur un système de vote anonyme. Le front-end est développé en utilisant Vue. Je souhaite essayer Electron pour empaqueter temporairement le client. Après

, j'ai choisi d'utiliser electron-builder pour l'emballage, car après l'avoir essayé, j'ai constaté que la taille du fichier après emballage de electron-packager est plus grande, tandis que la taille de l'emballage de electron-builder est relativement petite et prend en charge plus de formats d'emballage. J'ai donc finalement choisi electron-builder pour l'emballage.

Travail de préparation

Personnellement, je n'ai pas connecté directement Electron au projet vue, mais je l'ai intégré dans le projet de démarrage rapide officiel d'Electron. Cliquez pour voir l'entrepôt electron-quick-start. Ce référentiel contient des paramètres de base packagés pour permettre aux utilisateurs de démarrer rapidement.

Les étapes spécifiques peuvent être résumées comme les étapes suivantes

1. InstallerElectron-builder
2. Cloner le référentiel de démarrage rapidegit clone https://github.com/electron/electron-quick-start.git
3. Projet Vue du package
4. Copiez le fichier cible vue emballé dans le projet de démarrage rapide Electron
5. Ajouter une configuration et un package personnalisés

Installer electronic-builder

Afin de faciliter une utilisation future, j'ai directement effectué l'installation globale ici. Les amis peuvent choisir différentes méthodes d'installation en fonction des besoins réels :

npm install electron-builder -g

L'interface d'installation est la suivante. indiqué ci-dessous

Ajouter une configuration

Mes informations de configuration sont jointes ci-dessous à titre de référence Pour des informations de configuration et des attributs spécifiques, vous pouvez consulter le Document officiel.

package.json

{  "name": "electron-quick-start",  "version": "1.0.0",  "author": "肖尊严",  "copyright": "Copyright © 2020 肖尊严",  "description": "基于同态加密算法的匿名投票系统",  "main": "main.js",  "scripts": {    "start": "electron .",    "build": "electron-builder --win --x64"  },  "build": {    "appId": "cn.beatree.anonvote",    "productName": "AnonVote 匿名投票系统",    "mac": {      "icon": "favicon.ico",      "target": ["dmg","zip"]    },    "win": {      "icon": "favicon.ico",      "target": ["nsis","zip", "portable"]    }  },  "repository": "https://github.com/electron/electron-quick-start",  "keywords": [    "Electron",    "quick",    "start",    "tutorial",    "demo"  ],  "author": "GitHub",  "license": "CC0-1.0",  "devDependencies": {    "electron": "^6.1.1"  },  "dependencies": {  }}

Exécutez la commande pour packager

npm run build

Exécutez-la simplement et le fichier cible sera généré dans le répertoire dist

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!