Nuxt-Grundlagen
Nuxt-Struktur, pages-Verzeichnis, automatisches Routing, Layouts, app.vue, server-Verzeichnis, nuxt.config
1Was ist die minimal erforderliche Struktur für eine Nuxt-3-Anwendung?
Was ist die minimal erforderliche Struktur für eine Nuxt-3-Anwendung?
Antwort
Eine Nuxt-3-Anwendung benötigt nur eine app.vue-Datei oder ein pages/-Verzeichnis im Projektstammverzeichnis. Wenn app.vue ohne pages/-Ordner vorhanden ist, erstellt Nuxt eine Anwendung ohne Vue Router. Wenn pages/ existiert, aktiviert Nuxt automatisch das file-based routing und benötigt <NuxtPage /> in app.vue, um Routen anzuzeigen.
2Wie funktioniert das automatische Routing im pages/-Verzeichnis?
Wie funktioniert das automatische Routing im pages/-Verzeichnis?
Antwort
Das pages/-Verzeichnis von Nuxt verwendet file-based routing: Jede .vue-Datei erstellt automatisch eine entsprechende Route. Zum Beispiel wird pages/index.vue zur Route '/', pages/about.vue wird zu '/about', und pages/blog/[id].vue erstellt eine dynamische Route '/blog/:id'. Dieser Ansatz macht die manuelle Router-Konfiguration überflüssig.
3Welche Rolle spielt die <NuxtPage />-Komponente in app.vue?
Welche Rolle spielt die <NuxtPage />-Komponente in app.vue?
Antwort
Die <NuxtPage />-Komponente ist ein Outlet, der den Inhalt der aktiven Seite basierend auf der aktuellen Route anzeigt. Sie ist in app.vue verpflichtend, wenn das pages/-Verzeichnis existiert. Ohne <NuxtPage /> werden Routen nicht angezeigt. Sie entspricht <router-view /> im Standard-Vue-Router, ist aber für Nuxt angepasst.
Wie wendet man ein bestimmtes Layout auf eine Seite in Nuxt 3 an?
Was ist der Unterschied zwischen der Verwendung von <NuxtLayout> in app.vue und dem Verzicht darauf?
+19 Interview-Fragen
Weitere Vue.js / Nuxt.js-Interviewthemen
JavaScript-Grundlagen
Modernes JavaScript (ES6+)
Vue-Grundlagen
Vue-Komponenten
Vue Router
Pinia State Management
Vuex (Legacy)
Composition API
Vue-Reaktivität
Nuxt Data Fetching
Nuxt SSR & SSG
Nuxt Server-Routes
Nuxt-Module
Vue Composables
Vue Formulare & Validierung
Nuxt State Management
Vue-Testing
Nuxt-Deployment & CI/CD
Vue-Performance
Fortgeschrittene Vue-Patterns
TypeScript mit Vue
Nuxt-Authentifizierung
SEO mit Nuxt
Nuxt-Internationalisierung
Vue-Architektur
Nuxt-Sicherheit
Vue-Ökosystem
Migration Vue 2→3 & Nuxt 2→3
Meistere Vue.js / Nuxt.js für dein nächstes Interview
Zugang zu allen Fragen, Flashcards, technischen Tests, Code-Review-Übungen und Interview-Simulatoren.
Kostenlos starten