Installieren und Konfigurieren eines Nuxt.js Projekts
Installieren Sie Node.js
Stellen Sie sicher, dass Node.js auf Ihrem Computer installiert ist. Sie können die neueste Version von der offiziellen Node.js-Website herunterladen.
Installieren Sie die Vue-CLI
Öffnen Sie Ihr Terminal oder Command Prompt und führen Sie den folgenden Befehl aus, um Vue CLI zu installieren(falls noch nicht installiert):
npm install -g vue-cli
Erstellen Sie ein Nuxt.js Projekt
Navigieren Sie im Terminal, zu dem Verzeichnis, in dem Sie Ihr Projekt erstellen möchten, und führen Sie den folgenden Befehl aus, um ein Nuxt.js Projekt zu erstellen:
vue init nuxt-community/starter-template my-nuxt-project
Projektkonfiguration
Befolgen Sie die Anweisungen im, um Terminal Ihr Projekt zu konfigurieren. Sie können verschiedene Optionen für Ihr Projekt auswählen, z. B. die Verwendung von ESLint, die Installation Axios usw.
Erstellen der ersten Seite und Anzeigen grundlegender Inhalte:
Öffnen Sie das Projektverzeichnis
Öffnen Sie Ihr Terminal Projektverzeichnis und navigieren Sie mit dem Befehl cd my-nuxt-project(oder dem von Ihnen gewählten Ordnernamen) zum Projektverzeichnis.
Erstellen Sie eine neue Seite
Verwenden Sie die Vue-CLI, um mit dem folgenden Befehl eine neue Seite zu generieren:
npx vue-cli-service generate page mypage
Bearbeiten Sie die neue Seite
Öffnen Sie die mypage.vue Datei im pages Verzeichnis und bearbeiten Sie den Inhalt der Seite. Sie können HTML, Vue-Komponenten und Daten hinzufügen.
Zeigen Sie die Seite an
In der layouts/default.vue Datei können Sie das <nuxt/> Tag verwenden, um den Inhalt der Seite anzuzeigen.
Führen Sie das Projekt aus
Führen Sie im Terminal folgenden Befehl aus, um das Projekt zu starten und Ihre Seite im Browser anzuzeigen:
npm run dev
Jetzt haben Sie Ihre erste Seite im Nuxt.js Projekt und können den Inhalt nach Ihren Wünschen anpassen.