Toolverse
Wszystkie skille

nuxt

autor: antfu

Pełnowartościowy framework Vue z renderowaniem serwerowym i routingiem opartym na strukturze plików

Instalacja

Wybierz klienta i sklonuj repozytorium do odpowiedniego katalogu skilli.

Instalacja

Szybkie info

Autor
antfu
Kategoria
Frontend
Wyświetlenia
43

O skillu

Nuxt to framework full-stack do budowania aplikacji Vue z wbudowanym renderowaniem po stronie serwera (SSR), automatycznym importowaniem komponentów i composables, oraz routingiem opartym na konwencji katalogów. Obsługuje hybrydowe renderowanie, pobieranie danych za pomocą useFetch i useAsyncData, middleware, oraz wdrażanie na Node.js, platformach bezserwerowych i edge. Skill zawiera kompletną dokumentację struktury projektu, konfiguracji, poleceń CLI, routingu, pobierania danych, modułów i wdrażania.

Jak używać

  1. Zainstaluj Nuxt w swoim projekcie, uruchamiając npm install nuxt lub yarn add nuxt. Skill zawiera dokumentację dla Nuxt 3.x, wygenerowaną na 2026-01-28.

  2. Skonfiguruj projekt, tworząc plik nuxt.config.ts w katalogu głównym. Możesz tam ustawić zmienne środowiskowe, konfigurację runtime i opcje aplikacji za pomocą app.config.ts.

  3. Organizuj strukturę katalogów zgodnie z konwencją Nuxt: umieszczaj strony w /pages, komponenty w /components, composables w /composables, a trasy serwera w /server/routes. Nuxt automatycznie importuje komponenty i composables.

  4. Pobieraj dane za pomocą useFetch lub useAsyncData w komponentach, korzystając z wbudowanego cachowania i funkcji refresh. Możesz też używać $fetch do bezpośrednich żądań HTTP.

  5. Definiuj middleware dla tras w /server/middleware lub jako middleware komponentów, aby kontrolować dostęp i logikę przed renderowaniem.

  6. Wdrażaj aplikację za pomocą Nitro, który obsługuje Node.js, platformy bezserwerowe (Vercel, Netlify) i edge (Cloudflare). Użyj npm run build do budowania i npm run preview do testowania produkcji lokalnie.

Podobne skille