Heim >Web-Frontend >Front-End-Fragen und Antworten >Electron-Packer verpackt das Frontend in eine Anwendung
Vor kurzem arbeite ich an einem anonymen Abstimmungssystem, das mit Vue entwickelt wurde. Ich möchte versuchen, Electron den Client zu paketieren. Nach
habe ich mich für die Verwendung von electron-builder
zum Verpacken entschieden, da ich nach dem Ausprobieren festgestellt habe, dass die Dateigröße nach dem Verpacken von electron-packager
größer war, während das Verpackungsvolumen von electron-builder
relativ klein war unterstützte mehr Verpackungsformate, also entschied ich mich schließlich für electron-builder
für die Verpackung.
Ich persönlich habe Electron nicht direkt mit dem Vue-Projekt verbunden, sondern es in das offizielle Schnellstartprojekt von Electron gepackt. Klicken Sie hier, um das Electron-Quick-Start-Warehouse anzuzeigen. Dieses Warehouse enthält Grundeinstellungen für die Verpackung, um Benutzern einen schnellen Einstieg zu erleichtern.
Die spezifischen Schritte können wie folgt zusammengefasst werden
git clone https://github.com/electron/electron-quick-start.git
Um die zukünftige Verwendung zu erleichtern, habe ich die globale Installation hier direkt durchgeführt. Freunde können je nach tatsächlichem Bedarf verschiedene Installationsmethoden auswählen:
npm install electron-builder -g
Die Installationsoberfläche ist wie folgt unten gezeigt
Meine Konfigurationsinformationen sind unten als Referenz beigefügt. Für spezifische Konfigurationsinformationen und Eigenschaften können Sie das Offizielle Dokument anzeigen
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": { }}
npm run build
Führen Sie ihn einfach aus und die Zieldatei wird im dist-Verzeichnis generiert
Das obige ist der detaillierte Inhalt vonElectron-Packer verpackt das Frontend in eine Anwendung. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!