Electron ist ein Framework, mit dem Sie plattformübergreifende Desktop-Anwendungen mithilfe von Webtechnologien wie HTML, CSS und JavaScript entwickeln können. Die Installation von Electron unter Windows 10 mag für Anfänger eine entmutigende Aufgabe sein, aber wenn Sie diese detaillierte Anleitung befolgen, können Sie alle notwendigen Schritte problemlos ausführen.
Schritt 1: Installieren Sie den Node.js
Der erste Schritt ist, den Node zu installieren.js ist ein Framework, mit dem Sie JavaScript auf dem Server ausführen können. Gehen Sie zur offiziellen Website von Node.js (https://nodejs.org ) und laden Sie die neueste stabile Version für Windows herunter. Nachdem der Download abgeschlossen ist, führen Sie die Installationsdatei aus und folgen Sie den Anweisungen des Installationsassistenten.
Schritt 2: Erstellen eines neuen Projekts
Nach erfolgreicher Node-Installation.js öffnen Sie die Eingabeaufforderung (Command Prompt) und navigieren Sie zu dem Verzeichnis, in dem Sie ein neues Projekt erstellen möchten. Der Befehl zum Navigieren in ein Verzeichnis lautet wie folgt: cd-Pfad zu Verzeichnis. Führen Sie nach dem Navigieren in das gewünschte Verzeichnis den folgenden Befehl aus: npm init. Sie initialisiert ein neues Projekt und erstellt eine package-Datei.json, in dem Informationen über das Projekt und seine Abhängigkeiten gespeichert werden.
Schritt 3: Installieren von Electron
Führen Sie nach dem Erstellen eines neuen Projekts den Befehl aus: npm install electron. Sie wird Electron in Ihr Projekt herunterladen und installieren. Wenn die Installation abgeschlossen ist, können Sie Electron in Ihrer Anwendung verwenden. Zur Vereinfachung installieren Sie Electron global mit dem Befehl: npm install -g electron. Jetzt können Sie Electron aus einem beliebigen Verzeichnis auf Ihrem Computer ausführen.
Anmerkung: Wenn während der Installation Probleme auftreten, stellen Sie sicher, dass Sie die neueste Version von Node installiert haben.js und überprüfen Sie Ihre Internetverbindung.
Installieren von Git auf einem Computer: Vorbereiten der Installation von Electron unter Windows 10
Führen Sie die folgenden Schritte aus, um Git unter Windows 10 zu installieren:
- Besuchen Sie die offizielle Git-Website unter: https://git-scm.com .
- Laden Sie die Installationsdatei für Windows herunter, indem Sie auf der Hauptseite der Website auf die Schaltfläche "Download" klicken.
- Warten Sie, bis der Download abgeschlossen ist, und führen Sie dann das Installationsprogramm aus.
- Wählen Sie die gewünschten Einstellungen und Komponenten aus, um Git zu installieren. Behalten Sie die Standardeinstellungen bei, wenn Sie sich Ihrer Wahl nicht sicher sind.
- Wählen Sie im Schritt "Choosing the default editor used by Git" den Editor aus, mit dem Sie arbeiten möchten. Zum Beispiel "Use Visual Studio Code as Git's default editor", um Visual Studio Code zu verwenden, oder wählen Sie "Use Nano as Git's default editor", um Nano zu verwenden.
- Wählen Sie "Use Git from the Windows Command Prompt" als Option aus und klicken Sie auf "Next".
- Wählen Sie "Checkout Windows-style, commit Unix-style line endings" und klicken Sie auf "Next".
- Wählen Sie "Use Windows' default console window" als Option aus und klicken Sie auf "Next".
- Wählen Sie "Default" als Option "Choosing HTTPS transport Backend" aus und klicken Sie auf "Next".
- Wählen Sie "Dateisystem-Caching aktivieren", "Git Credential Manager aktivieren" und "Symbolische Links aktivieren" als zusätzliche Optionen aus (wenn sie nicht standardmäßig ausgewählt sind) und klicken Sie auf "Install".
- Erwarten Sie, dass die Installation von Git auf Ihrem Computer abgeschlossen ist.
- Nachdem die Git-Installation abgeschlossen ist, können Sie eine Eingabeaufforderung öffnen und den Befehl "git --version" eingeben, um sicherzustellen, dass Git erfolgreich installiert wurde.
Jetzt haben Sie Git auf Ihrem Computer installiert und können mit der Installation von Electron unter Windows 10 fortfahren.
Herunterladen und Installieren von Node.js unter Windows 10
- Öffnen Sie einen Browser und gehen Sie zur offiziellen Website von Node.js (https://nodejs.org).
- Suchen Sie auf der Hauptseite der Website nach dem Abschnitt "Node herunterladen.js" und klicken Sie auf den Download-Button.
- Wählen Sie Ihre bevorzugte Node-Version aus.js für Windows (es wird empfohlen, eine stabile Version zu wählen).
- Laden Sie das Node-Installationsprogramm herunter.js für Windows.
- Öffnen Sie nach Abschluss des Downloads das Node-Installationsprogramm.js.
- Klicken Sie im ersten Begrüßungsbildschirm des Installationsprogramms auf die Schaltfläche "Weiter".
- Lesen und akzeptieren Sie die Bedingungen der Node-Lizenzvereinbarung.js und dann auf die Schaltfläche Weiter klicken.
- Wählen Sie den Node-Installationspfad aus.js oder behalten Sie den Standardwert bei und klicken Sie dann auf Weiter.
- Wählen Sie die Komponenten aus, die Sie installieren möchten (es wird empfohlen, die Standardwerte beizubehalten), und klicken Sie dann auf die Schaltfläche Weiter.
- Klicken Sie auf dem letzten Bildschirm des Installationsprogramms auf die Schaltfläche Installieren.
- Warten Sie, bis der Node-Installationsprozess abgeschlossen ist.js auf Ihrem Computer.
- Schließen Sie nach Abschluss der Installation das Node-Installationsprogramm.js.
Jetzt Node.js wurde erfolgreich auf Ihrem Windows 10-Computer installiert. Sie sind bereit, mit dem nächsten Schritt fortzufahren – der Installation von Electron.
Installieren und Vorbereiten von Visual Studio Code für die Entwicklung von Electron-Anwendungen unter Windows 10
Schritt 1: Downloaden und installieren Sie VS Code.
Rufen Sie die offizielle VS Code-Website auf und laden Sie die Installationsdatei für Windows herunter. Führen Sie dann die heruntergeladene Datei aus und folgen Sie den Anweisungen des Installationsassistenten, um VS Code auf Ihrem Computer zu installieren.
Schritt 2: Erweitern Sie die Möglichkeiten von VS Code mit Plugins.
VS Code verfügt über eine große Anzahl von Plugins, die die Arbeit mit Electron-Anwendungen erheblich verbessern. Um Plugins zu installieren, öffnen Sie VS Code und klicken Sie auf den Tab "Extensions" (Erweiterungen) in der Seitenleiste. Geben Sie in der Suchleiste "electron" ein und Sie sehen eine Liste der mit Electron verbundenen Plugins. Installieren Sie die Plugins, die Sie interessieren, indem Sie auf die Schaltfläche "Installieren" neben ihnen klicken.
- electron
Dieses Plugin fügt Unterstützung für die Entwicklung von Electron-Anwendungen in VS Code hinzu. Es bietet Debugging-Tools, einen automatischen Neustart der Anwendung und vieles mehr. - electron-reload
Dieses Plugin stellt sicher, dass die Anwendung automatisch neu geladen wird, wenn Änderungen am Quellcode vorgenommen werden. Dies vereinfacht den Entwicklungs- und Debugging-Prozess in VS Code erheblich. - electron-builder
Dieses Plugin fügt die Möglichkeit hinzu, Electron-Anwendungen zu erstellen und zu veröffentlichen. Es vereinfacht den Prozess der Erstellung von Installationsdateien und Paketen für verschiedene Plattformen.
Schritt 3: Konfigurieren Sie die VS Code-Einstellungen für die Arbeit mit Electron.
Um die Arbeit mit Electron-Anwendungen zu erleichtern, können Sie eine Reihe von Parametern in VS Code konfigurieren. Öffnen Sie dazu die Datei settings.json finden Sie unter "Datei" -> "Einstellungen" -> "Einstellungen" oder drücken Sie `Strg + ,`. Fügen Sie in dieser Datei die folgenden Optionen hinzu:
Schritt 4: Erstellen Sie ein neues Electron-Projekt in VS Code.
Öffnen Sie VS Code und wählen Sie "File" (Datei) -> "Open Folder" (Ordner öffnen). Wählen Sie dann den Ordner aus, in dem Sie ein neues Electron-Projekt erstellen möchten. Geben Sie auf der Registerkarte "Terminal" den folgenden Befehl ein:
npx create-electron-app my-electron-app
Dieser Befehl erstellt ein neues Electron-Projekt im ausgewählten Ordner.
Schritt 5: Entwickeln und debuggen Sie Ihre Electron-Anwendung.
Jetzt können Sie das erstellte Projekt in VS Code öffnen und mit der Entwicklung Ihrer Electron-Anwendung beginnen. Verwenden Sie VS Code-Plugins und -Funktionen, um Ihre Anwendung einfach zu entwickeln und zu debuggen.
Dies war eine detaillierte Anleitung zum Installieren und Konfigurieren von Visual Studio Code für die Entwicklung von Electron-Anwendungen unter Windows 10. Jetzt sind Sie bereit, Ihre eigenen Apps mit Electron und VS Code zu erstellen!
Installieren und Konfigurieren von Electron Forge zum Erstellen und Erstellen von Electron-Projekten unter Windows 10
Schritt 1: Installieren von Node.js
Vor der Installation von Electron Forge muss Node installiert werden.js.
1. Gehen Sie zur offiziellen Website von Node.js über https-Link://nodejs.org.
2. Laden Sie die aktuelle Version von Node herunter und installieren Sie sie.js für Windows 10.
3. Führen Sie die Installationsdatei aus, und folgen Sie den Anweisungen des Installationsassistenten.
4. Stellen Sie sicher, dass die Installation korrekt ist, indem Sie node -v an der Eingabeaufforderung ausführen. Die Node-Version sollte als Antwort ausgegeben werden.js.
Schritt 2: Erstellen eines Projekts
1. Öffnen Sie eine Eingabeaufforderung.
2. Navigieren Sie zu dem Ordner, in dem Sie das Projekt erstellen möchten. Führen Sie beispielsweise den Befehl cd path/to/project/folder aus .
3. Erstellen Sie ein neues Electron-Projekt, indem Sie den Befehl npx create-electron-app project-name ausführen. Ersetzt project-name im Namen Ihres Projekts.
4. Warten Sie, bis der Projekterstellungsprozess abgeschlossen ist.
Schritt 3: Projekt starten
1. Navigieren Sie zu Ihrem Projektordner, indem Sie den Befehl cd project-name ausführen.
2. Starten Sie das Projekt, indem Sie den Befehl npm start ausführen.
Schritt 4: Erstellen eines Projekts
1. Öffnen Sie eine Eingabeaufforderung.
2. Navigieren Sie zu Ihrem Projektordner, indem Sie den Befehl cd project-name ausführen.
3. Führen Sie den Befehl npm run make aus, um Ihr Projekt zu erstellen.
4. Warten Sie, bis der Erstellungsprozess abgeschlossen ist.
5. Im Ordner out/make die Installationsdatei Ihrer Electron-Anwendung wird gespeichert.
Glückwunsch! Jetzt können Sie Electron-Projekte mit Electron Forge unter Windows 10 erstellen und sammeln.
Abschluss der Installation von Electron unter Windows 10: Erstellen und Ausführen der ersten Electron-Anwendung
Nachdem Sie nun alle erforderlichen Komponenten erfolgreich installiert haben, ist es an der Zeit, Ihre erste Electron-App unter Windows 10 zu erstellen und auszuführen. Befolgen Sie diese Schritte, um dieses Ziel zu erreichen:
1. Erstellen Sie einen neuen Ordner auf Ihrem Computer, in dem sich Ihre Electron-Anwendung befindet.
2. Öffnen Sie eine Eingabeaufforderung, und navigieren Sie mit dem Befehl cd Pfad zu Ordner zum erstellten Ordner.
3. Initialisieren Sie ein neues Electron-Projekt, indem Sie den folgenden Befehl ausführen:
npx create-electron-app ваше_приложение4. Warten Sie, bis der Vorgang abgeschlossen ist und alle erforderlichen Abhängigkeiten installiert sind. Die Anwendung wird in Ihrem Projektordner erstellt.
5. Navigieren Sie mit dem Befehl cd your_anwendung zu Ihrem Projektordner.
6. Führen Sie die Electron-Anwendung aus, indem Sie den folgenden Befehl ausführen:
npm start7. Nachdem Sie diesen Befehl ausgeführt haben, muss Ihre Electron-Anwendung erfolgreich gestartet werden. Das Anwendungsfenster wird auf Ihrem Desktop geöffnet.
Jetzt können Sie mit der Entwicklung Ihrer eigenen Electron-Anwendung beginnen und alle Funktionen nutzen, die Electron bietet, um plattformübergreifende Anwendungen mit Webtechnologien zu erstellen.
