Entwicklung basierend auf Tauri und Vue

Stellen Sie sicher, dass die Installation der Umgebung abgeschlossen ist

Die Konfiguration der Standardumgebung in diesem Artikel ist vollständig [hier wird nur die Umgebung zusammengefasst, die installiert werden muss]:

1. Microsoft Visual Studio C++ installiert

2. Die entsprechende Version von Node.js wurde installiert [Hinweis: Um eine Inkompatibilität der Version von nodejs zu vermeiden, wird empfohlen, nvm im Voraus zu installieren, um die Version von nodejs zu wechseln. Wenn Sie nodejs zuerst installiert haben, müssen Sie es deinstallieren und dann installieren nvm. 】

3. Rost verbaut

4. WebView2 wurde installiert [Win11-System kommt mit WebView2, der Autor ist Win10-System, der Inhalt wird nicht angezeigt, wenn Tauri ausgeführt wird, daher wird empfohlen, WebView2 zu erkennen und neu zu installieren]

Projekt erstellen

Öffnen Sie das Terminal im angegebenen Verzeichnis und geben Sie den Befehl Yarn Create Tauri-App ein, um das Projekt zu erstellen

yarn create tauri-app

Warten Sie nach Eingabe der Eingabetaste, bis Erfolg angezeigt wird, und geben Sie den Projektnamen, das Paketverwaltungstool und das JS-Framework wie folgt ein

Die Erstellung ist abgeschlossen, jetzt müssen Sie nur noch den angegebenen Ordner gemäß dem Befehl eingeben, der in Now run and run the tauri file angegeben ist

Im src-Ordner unter dem tauri-app-Ordner [also dem oben erstellten Projekt] können Sie es kompilieren und in das native Vue-Projekt verschieben

Ändern Sie die Dateien von App.vue und Komponente

Projekt ausführen

Geben Sie den angegebenen Ordner ein

  cd tauri-app

Geben Sie den Ausführungsbefehl ein

yarn tauri dev

Die Kompilierung ist beim ersten Durchlauf langsam, bitte haben Sie etwas Geduld

[Das Folgende ist der Status des zweiten Laufs]

Wenn der Vorgang erfolgreich ist, wird das entsprechende Fenster angezeigt

verpackte Artikel

Ändern Sie zuerst den "Identifier" in tauri.conf.json unter dem Ordner src-tauri [früher com.tauri.dev]

Geändert wie folgt (nicht eindeutig):

com.tauri.build

Geben Sie dann das Terminal unter dem angegebenen Ordner ein und geben Sie den folgenden Befehl ein:

npm run tauri build

Warten auf Kompilierung [Referenzzeit: muss einige Minuten warten]

Die Zusammenstellung ist wie folgt abgeschlossen

Geben Sie zum Herunterladen die Adresse mit der Dateierweiterung .msi in die Adressleiste der Datei ein

Geben Sie den obigen Dateipfad ein, drücken Sie die Eingabetaste, und das Installationsfenster für die Installations-Exe-Datei wird angezeigt. Klicken Sie gemäß der Eingabeaufforderung auf Weiter [Sie können die Installationsadresse bei Bedarf ändern]

Schließlich wird das Installationspaket unter der geänderten Installationsadresse [oder der Standardadresse] generiert.

Doppelklicken Sie, um tauri-app.exe zu öffnen und die Datei offline auszuführen

Das Obige ist ein einfaches Tauri+Vue-Beispiel.