Sužinokite, kaip pradėti naudotis stilinga „Svelte“ programa.
Žiniatinklio karkasai ateina ir išeina, tačiau vienas iš perspektyviausių yra „Svelte“. „Svelte“ yra puiki „React“ alternatyva ir, nors jau turi didelę bendruomenę, tai tikrai yra pagrindas, į kurį reikia atkreipti dėmesį. „Svelte“ leidžia lengvai nustatyti programų stilių, naudojant kelis būdus.
Svelte Applications stiliaus kūrimas
Kiekvienai vartotojo sąsajos bibliotekai ar sistemai reikalingas jos komponentų stiliaus metodas. Dauguma komponentais pagrįstų struktūrų palaiko tradicinį komponentų stiliaus metodą: tiesiog importuokite CSS failą ir viskas. Svelte nėra išimtis. „Svelte“ yra trys pagrindiniai būdai, kaip formuoti programas, kurių kiekvienas turi savo privalumų ir trūkumų.
„Svelte“ projekto nustatymas
Norėdami įdiegti Svelte, galite naudoti ViteJS priekinės dalies kūrimo įrankis. Norėdami nustatyti dalykus, įsitikinkite, kad Node.js vykdymo laikas ir mazgo paketų tvarkyklė (NPM) yra tinkamai įdiegti jūsų kompiuteryje. Galite patikrinti Node.js ir NPM prieinamumą paleisdami šią terminalo komandą:
node -v
Įsitikinę, kad Node veikia, atidarykite terminalą ir paleiskite šiuos veiksmus:
npm create vite
Arba:
yarn create vite
Tai turėtų būti naujo Vite projekto pagrindas. Nustatykite projekto pavadinimą taip, kaip norite, sistema turi būti "Svelte", o variantas turėtų būti "JavaScript" (tačiau galite naudoti "TypeScript", jei jums tai patinka). Dabar perjunkite į projekto katalogą naudodami cd komandą ir paleiskite šią komandą, kad įdiegtumėte reikiamas priklausomybes:
npm install
Arba:
yarn
Įdiegę priklausomybes galite paleisti kūrimo serverį paleisdami:
npm run dev
Arba:
yarn dev
Projekto žymėjimo apibrėžimas
Atidarykite projektą bet kuriame pasirinktame kodo rengyklėje ir ištrinkite turto ir lib aplanką. Be to, būtinai išvalykite turinį app.css failas ir App.svelte failą. Atidaryk main.js failą ir pakeiskite turinį taip:
import App from'./App.svelte'const app = new App({
target: document.getElementById('app'),
})
exportdefault app
Tada atidarykite App.svelte faile ir scenarijus pažymėkite ir sukurkite masyvą, kuriame bus skirtingos nuorodos, pavyzdžiui:
