Detaillierte Schritte zum Erstellen eines Vue-Scaffolding-Projekts

Vue-Gerüst -> vue.cli

Erstellen Sie schnell eine große, voll funktionsfähige Vue-Projektvorlage (Initialisiererprojekt).

Einfache Erklärung: Schnell ein leeres Vue-Projekt erstellen

Installation (globale Installation)

Globale Installation

> npm i @vue/cli -g

Erstellen Sie ein Vue-Scaffolding-Projekt

> vue erstellt Projektnamen

Konfigurationsoptionen

Vue CLI v4.5.11
? Bitte wählen Sie eine Voreinstellung: (Verwenden Sie die Pfeiltasten)
> Standard ([Vue 2] babel, eslint) 
 Standard (Vue 3 Vorschau) ([Vue 3] babel, eslint) 
 Manuelles Auswählen von Features

Drücken Sie zum Auswählen die Auf- und Ab-Taste und zum Bestätigen die Eingabetaste. Wählen Sie hier die dritte Option „Manuell“ aus.

Features auswählen

Vue CLI v4.5.11
? Bitte wählen Sie eine Voreinstellung: Funktionen manuell auswählen
? Überprüfen Sie die für Ihr Projekt benötigten Funktionen: (Drücken Sie <Leertaste> zum Auswählen, <a> zum Umschalten auf alle, <i> zum Umkehren der Auswahl)
>(*) Vue-Version auswählen
 (*) Babel
 () TypoScript
 ( ) Progressive Web App (PWA) Unterstützung
 ( ) Router
 ( ) Vuex
 ( ) CSS-Präprozessoren
 (*) Linter / Formatierer
 ( ) Komponententests
 ( ) E2E-Tests

Bewegen Sie den Cursor nach oben und unten, drücken Sie die Leertaste zum Auswählen, drücken Sie die Eingabetaste zum Bestätigen, wählen Sie hier Option 1 2 5 6

Ausführung auswählen

? Überprüfen Sie die für Ihr Projekt erforderlichen Funktionen: Wählen Sie die Vue-Version, Babel, Router, Vuex
Wählen Sie eine Version von Vue.js, mit der Sie das Projekt starten möchten (verwenden Sie die Pfeiltasten).
> 2.x
 3.x (Vorschau)

Wählen Sie hier 2.x

Ob der Verlaufsmodus verwendet werden soll

? Verlaufsmodus für Router verwenden? (Erfordert ordnungsgemäße Servereinrichtung für Index-Fallback in der Produktion) (J/n)

Geben Sie hier n ein und drücken Sie die Eingabetaste

Konfigurationsort von Babel, ESLint usw.

Wo platzieren Sie die Konfiguration für Babel, ESLint usw. lieber? (Verwenden Sie die Pfeiltasten.)
> In dedizierten Konfigurationsdateien
 In package.json

Wählen Sie hier die erste dedizierte Konfigurationsdatei zum Speichern aus

Als Vorgabe speichern

? Dies als Vorgabe für zukünftige Projekte speichern? (j/n)

Hier wählen wir n

Erfolg schaffen

Vue CLI v4.5.11
Projekt wird in D:\MyStudy\myvue2 erstellt.
⚙️ CLI-Plugins werden installiert. Dies kann eine Weile dauern ...


> [email protected] nach der Installation D:\MyStudy\myvue2\node_modules\core-js
> Knoten -e "versuche {require('./postinstall')}catch(e){}"


> [email protected] nach der Installation D:\MyStudy\myvue2\node_modules\ejs
> Knoten ./postinstall.js

1208 Pakete von 928 Mitwirkenden in 21.836 Sekunden hinzugefügt

61 Pakete suchen nach Finanzierung
Führen Sie „npm fund“ aus, um weitere Details zu erfahren.

🚀 Generatoren aufrufen …
📦 Zusätzliche Abhängigkeiten installieren …

5 Pakete von 1 Mitwirkenden in 4,671 s hinzugefügt

61 Pakete suchen nach Finanzierung
Führen Sie „npm fund“ aus, um weitere Details zu erfahren.    

⚓ Vervollständigungs-Hooks ausführen …

📄 README.md wird generiert …

🎉 Projekt myvue2 erfolgreich erstellt.  
👉 Beginnen Sie mit den folgenden Befehlen:

$ cd myvue2
$ npm ausführen serve

Geben Sie das Projektverzeichnis ein

> CD myvue2

Starten des Dienstes

> npm ausführen serve

 FERTIG Erfolgreich kompiliert in 2492 ms                   

 App läuft unter:
 - Lokal: http://localhost:8080/ 
 - Netzwerk: http://192.168.17.154:8080/

 Beachten Sie, dass die Entwicklungsversion nicht optimiert ist.
 Führen Sie „npm run build“ aus, um einen Produktionsbuild zu erstellen.

Damit ist dieser Artikel über die detaillierten Schritte zum Erstellen eines Vue-Scaffolding-Projekts abgeschlossen. Weitere relevante Inhalte zum Erstellen eines Vue-Scaffolding-Projekts finden Sie in früheren Artikeln auf 123WORDPRESS.COM oder in den folgenden verwandten Artikeln. Ich hoffe, dass jeder 123WORDPRESS.COM in Zukunft unterstützen wird!

Das könnte Sie auch interessieren:

Mehrere Möglichkeiten zum Einführen von Popup-Layer-Plug-Ins in das Vue-CLI-Gerüst
Ursachen und Lösungen für Fehler bei der Erstellung von statischen Ressourcenanforderungen für Vue-CLI-Scaffolding
Spezifische Verwendung des VUE-Gerüsts
So erstellen Sie Ihr eigenes Gerüst, indem Sie vue-cli imitieren

<<: Detailliertes Tutorial zur Installation von mysql8.0 mit dem Linux-Befehl yum

>>: Zusammenfassung zur Verwendung des Ausrufezeichen-Befehls (!) unter Linux