Tworzenie projektu za pomocą npm create svelte
Utwórz szkielet nowego projektu SvelteKit za pomocą oficjalnego CLI i wybierz odpowiednie opcje.
Tworzenie projektu za pomocą npm create svelte to bezpłatna lekcja Sveltejs Academy na CoddyKit. To lekcja 2 z 4. Możesz przeczytać całą lekcję poniżej za darmo — a potem ćwiczyć ją interaktywnie w przeglądarce z wbudowanym edytorem kodu i tutorem AI dostępnym 24/7. To część ścieżki edukacyjnej Sveltejs Academy, a Twój postęp synchronizuje się między webem a aplikacją CoddyKit. Kurs Sveltejs Academy zawiera 4 lekcji w sumie.
Narzędzie do tworzenia szkieletu projektu
Oficjalnym sposobem rozpoczęcia projektu SvelteKit jest polecenie npm create svelte@latest. Generuje ono gotową do uruchomienia aplikację.
npm create svelte@latest my-appPytania kreatora
Kreator poprosi o wybranie szablonu (skeleton lub demo app), obsługi TypeScriptu oraz narzędzi (ESLint, Prettier, Playwright i Vitest).
Wybór szablonu
Projekt Skeleton zapewnia minimalny układ. Aplikacja Demo zawiera mały przykład gry Sverdle do przeanalizowania.
Opcja TypeScript
Jeśli potrzebna jest kontrola typów, należy wybrać Yes dla TypeScriptu. Kreator konfiguruje TS i używa lang="ts" w blokach script.
Instalowanie zależności
Po zakończeniu pracy kreatora należy przejść do katalogu projektu i zainstalować pakiety.
cd my-app
npm installUruchamianie serwera deweloperskiego
Skrypt dev uruchamia serwer z automatycznym przeładowywaniem pod adresem http://localhost:5173.
npm run devOtwieranie w przeglądarce
Należy otworzyć adres URL wyświetlony w terminalu. Powinna pojawić się strona powitalna. Następnie można edytować plik src/routes/+page.svelte i obserwować aktualizacje na żywo.
Budowanie wersji produkcyjnej
Skrypt build uruchamia kompilator i tworzy katalog wynikowy gotowy do udostępnienia.
npm run build
npm run previewWybór menedżera pakietów
Można użyć npm, pnpm lub yarn. pnpm jest popularny ze względu na oszczędne wykorzystanie miejsca na dysku i rygorystyczne rozwiązywanie zależności.
Konfiguracja edytora
Należy zainstalować rozszerzenie Svelte for VS Code, aby uzyskać wyróżnianie składni, IntelliSense i diagnostykę w plikach .svelte.
Opcjonalna inicjalizacja Git
Kreator oferuje zainicjowanie repozytorium Git. Wybranie opcji Yes dodaje rozsądnie skonfigurowany plik .gitignore.
Szybki test
Które polecenie tworzy nowy projekt SvelteKit?
Podsumowanie
Można już utworzyć szkielet projektu, wybrać TypeScript i narzędzia, zainstalować zależności oraz uruchamiać skrypty dev i build.
Ucz się HTML dzięki korepetycjom AI — za darmo
Pisz i uruchamiaj kod w przeglądarce, otrzymuj natychmiastową pomoc od korepetytora AI dostępnego 24/7 i kontynuuj naukę w sieci lub w aplikacji.
- Kursy
- 41
- Lekcje
- 163
Często zadawane pytania
Czy lekcja „Tworzenie projektu za pomocą npm create svelte” jest bezpłatna?
Tak — pełny tekst „Tworzenie projektu za pomocą npm create svelte” jest dostępny za darmo tutaj w sieci. Aby ćwiczyć ją interaktywnie (wbudowany edytor kodu i tutor AI dostępny 24/7) i odblokować resztę kursu Sveltejs Academy, przejdź na CoddyKit PRO. Kurs Sveltejs Academy zawiera 4 lekcji w sumie.
Co nauczysz się w „Tworzenie projektu za pomocą npm create svelte”?
Utwórz szkielet nowego projektu SvelteKit za pomocą oficjalnego CLI i wybierz odpowiednie opcje. Ćwiczysz Sveltejs Academy z praktycznym kodem, który uruchamiasz bezpośrednio w przeglądarce, a tutor AI dostępny 24/7 odpowiada na Twoje pytania podczas pracy nad lekcją.
Czy potrzebuję doświadczenia, aby zacząć Sveltejs Academy?
Nie wymagamy żadnego doświadczenia. Sveltejs Academy w CoddyKit jest strukturyzowany dla początkujących i zaawansowanych użytkowników, więc możesz zacząć tutaj lub od początku i uczyć się w swoim tempie. To lekcja 2 z 4.
Ile czasu zajmuje lekcja „Tworzenie projektu za pomocą npm create svelte”?
Większość lekcji CoddyKit trwa około 5–10 minut. Każda lekcja to mały, interaktywny krok, dzięki czemu robisz systematyczne postępy i zawsze wracasz dokładnie do tego samego miejsca — na webie i w aplikacji.
Czy mogę pisać i uruchamiać kod w tej lekcji Sveltejs Academy?
Tak. Każda lekcja Sveltejs Academy zawiera wbudowany edytor kodu, więc piszesz i uruchamiasz prawdziwy kod bezpośrednio w przeglądarce i od razu otrzymujesz sprzężenie zwrotne od AI — bez konfiguracji na komputerze.
Wszystkie lekcje w tym kursie
- Czym jest Svelte i dlaczego przeprowadza kompilację
- Tworzenie projektu za pomocą npm create svelte
- Struktura projektu: src routes static
- Serwer deweloperski i Hot Module Replacement