Sveltejs Academy · Oppitunti

Projektin luominen komennolla npm create svelte

Luokaa uusi SvelteKit-projekti virallisen CLI:n avulla ja valitkaa oikeat asetukset.

Oppitunti 2/413 vaihetta

Projektin luominen komennolla npm create svelte on ilmainen Sveltejs Academy-oppitunti CoddyKitissä. Tämä on oppitunti 2/4. Voit lukea koko oppitunnin alta ilmaiseksi ja harjoitella sen jälkeen käytännössä selaimessa sisäänrakennetulla koodieditorilla ja ympäri vuorokauden käytettävissä olevan tekoälytuutorin avulla. Oppitunti kuuluu Sveltejs Academy-oppimispolkuun, ja edistymisesi synkronoituu verkon ja CoddyKit-sovelluksen välillä. Sveltejs Academy-kurssilla on yhteensä 4 oppituntia.

Projektin alustustyökalu

Virallinen tapa aloittaa SvelteKit-projekti on käyttää komentoa npm create svelte@latest. Se luo valmiiksi ajettavan sovelluksen.

npm create svelte@latest my-app

Ohjattu toiminto kysyy

Sinulta kysytään mallipohjaa (skeleton tai demo app), TypeScript-tukea ja työkaluja (ESLint, Prettier, Playwright ja Vitest).

Mallipohjan valinta

Skeleton-projekti tarjoaa vähimmäisrakenteen. Demo-sovellus sisältää pienen Sverdle-peliesimerkin tutkittavaksi.

TypeScript-asetus

Valitse Yes TypeScriptille, jos haluat tyyppiturvallisuutta. Ohjattu toiminto määrittää TS-asetukset ja käyttää script-lohkoissa määritettä lang="ts".

Asenna riippuvuudet

Kun ohjattu toiminto on valmis, siirry projektin hakemistoon ja asenna paketit.

cd my-app
npm install

Käynnistä kehityspalvelin

Käynnistä hot-reload-palvelin osoitteessa http://localhost:5173 käyttämällä dev-skriptiä.

npm run dev

Avaa selaimessa

Avaa terminaalissa tulostettu URL-osoite. Näet tervetulosivun. Muokkaa tiedostoa src/routes/+page.svelte ja seuraa, kuinka se päivittyy reaaliajassa.

Tuotantokäännös

build-skripti suorittaa kääntäjän ja tuottaa palvelua varten valmiin tuloshakemiston.

npm run build
npm run preview

Paketinhallinnan valinta

Voit käyttää npm-, pnpm- tai yarn-paketinhallintaa. pnpm on suosittu levytilan tehokkaan käytön ja tiukan riippuvuuksien ratkaisun ansiosta.

Editorin asetukset

Asenna Svelte for VS Code -laajennus, jotta saat syntaksin korostuksen, IntelliSense-tuen ja diagnostiikan .svelte-tiedostoihin.

Gitin alustaminen on valinnaista

Ohjattu toiminto tarjoaa Git-tietovaraston alustamista. Kun vastaat myöntävästi, projektiin lisätään tarkoituksenmukainen .gitignore-tiedosto.

Pikatarkistus

Millä komennolla luodaan uusi SvelteKit-projekti?

Yhteenveto

Nyt osaat alustaa projektin, valita TypeScriptin ja työkalut, asentaa riippuvuudet sekä suorittaa dev- tai build-skriptit.

Aloita maksutta

Opi HTML tekoälytuutorin avulla — ilmaiseksi

Kirjoita ja suorita oikeaa koodia selaimessa, saa välitöntä apua tekoälytuutorilta ympäri vuorokauden ja jatka siitä, mihin jäit, verkossa tai sovelluksessa.

Kurssit
41
Oppitunnit
163

Usein kysytyt kysymykset

Onko oppitunti ”Projektin luominen komennolla npm create svelte” ilmainen?

Kyllä – oppitunnin ”Projektin luominen komennolla npm create svelte” koko tekstin voi lukea täällä verkossa ilmaiseksi. Jos haluat harjoitella interaktiivisesti sisäänrakennetulla koodieditorilla ja ympäri vuorokauden käytettävissä olevan tekoälytuutorin avulla sekä avata koko Sveltejs Academy-kurssin, päivitä CoddyKit PROhon. Sveltejs Academy-kurssilla on yhteensä 4 oppituntia.

Mitä opin oppitunnilla ”Projektin luominen komennolla npm create svelte”?

Luokaa uusi SvelteKit-projekti virallisen CLI:n avulla ja valitkaa oikeat asetukset. Harjoittelet Sveltejs Academy-aihetta koodilla, jonka suoritat suoraan selaimessa. Ympäri vuorokauden käytettävissä oleva tekoälytuutori vastaa kysymyksiisi oppitunnin aikana.

Tarvitsenko kokemusta aloittaakseni Sveltejs Academy-opiskelun?

Aiempi kokemus ei ole tarpeen. CoddyKitin Sveltejs Academy-oppimispolku sopii vasta-alkajista edistyneisiin, joten voit aloittaa tästä tai alusta ja edetä omaan tahtiisi. Tämä on oppitunti 2/4.

Kuinka kauan ”Projektin luominen komennolla npm create svelte”-oppitunnin suorittaminen kestää?

Useimmat CoddyKitin oppitunnit kestävät noin 5–10 minuuttia. Jokainen oppitunti on lyhyt ja interaktiivinen, joten edistyt tasaisesti ja voit jatkaa siitä, mihin jäit – sekä verkossa että sovelluksessa.

Voinko kirjoittaa ja suorittaa koodia tällä Sveltejs Academy-oppitunnilla?

Kyllä. Jokainen Sveltejs Academy-oppitunti sisältää sisäänrakennetun koodieditorin, joten voit kirjoittaa ja suorittaa oikeaa koodia suoraan selaimessa ja saada välitöntä palautetta tekoälyltä – paikallista asennusta ei tarvita.

Kaikki tämän kurssin oppitunnit

  1. Mikä Svelte on ja miksi se käännetään
  2. Projektin luominen komennolla npm create svelte
  3. Projektin rakenne: src routes static
  4. Kehityspalvelin ja Hot Module Replacement
← Takaisin: Sveltejs Academy