Sveltejs Academy · Lektion

Konfigurera Vitest för Svelte-projekt

Konfigurera Vitest med Svelte-pluginen och jsdom-miljön för komponenttestning.

Lektion 1 av 413 steg

Konfigurera Vitest för Svelte-projekt är en gratis lektion i Sveltejs Academy på CoddyKit. Detta är lektion 1 av 4. Ni kan läsa hela lektionen gratis nedan och sedan öva praktiskt i webbläsaren med en inbyggd kodredigerare och en AI-handledare som är tillgänglig dygnet runt. Den ingår i lärvägen för Sveltejs Academy, och Era framsteg synkroniseras mellan webben och CoddyKit-appen. Kursen i Sveltejs Academy innehåller totalt 4 lektioner.

Vitest

Vitest är en snabb, Vite-inbyggd testrunner som används brett i Svelte-ekosystemet.

Installera

Lägg till Vitest och Svelte-pluginet.

npm install -D vitest @vitest/coverage-v8 @testing-library/svelte @testing-library/jest-dom jsdom

Konfiguration i vite.config.js

Lägg till en testsektion.

export default defineConfig({
  plugins: [sveltekit()],
  test: { environment: "jsdom", globals: true, setupFiles: ["./vitest-setup.js"] }
});

Setup-fil

Importera jest-dom-matchers i vitest-setup.js.

import "@testing-library/jest-dom";

Kör tester

Lägg till ett skript i package.json och kör det.

"test": "vitest"

Watch-läge

Vitest använder watch-läge som standard, vilket passar perfekt för TDD.

TypeScript

Vitest har inbyggt stöd för TypeScript med typmedvetna assertioner.

Kodtäckning

Generera täckningsrapporter med V8:s coverage-provider.

npx vitest run --coverage

CI-integration

Använd vitest run (utan watch-läge) i CI för förutsägbara körningar.

Snapshot-testning

Vitest stöder snapshots på samma sätt som Jest för att upptäcka regressioner.

IDE-integration

Vitests tillägg för VS Code låter dig köra tester direkt i editorn med editor-kommandon.

Snabbkontroll

Vilken miljö använder Vitest för DOM-tester?

Sammanfattning

Konfigurera Vitest med jsdom, Testing Library och jest-dom för snabba enhetstester av Svelte-komponenter.

Gratis att börja

Lär dig HTML med en AI-lärare – gratis

Skriv och kör riktig kod i webbläsaren, få omedelbar hjälp av en AI-lärare dygnet runt och fortsätt där du slutade – på webben eller i appen.

Kurser
41
Lektioner
163

Vanliga frågor

Är lektionen ”Konfigurera Vitest för Svelte-projekt” gratis?

Ja – hela texten till ”Konfigurera Vitest för Svelte-projekt” kan läsas gratis här på webben. Om Ni vill öva interaktivt med en inbyggd kodredigerare och en AI-handledare som är tillgänglig dygnet runt och låsa upp resten av kursen i Sveltejs Academy, kan Ni uppgradera till CoddyKit PRO. Kursen i Sveltejs Academy innehåller totalt 4 lektioner.

Vad lär jag mig i ”Konfigurera Vitest för Svelte-projekt”?

Konfigurera Vitest med Svelte-pluginen och jsdom-miljön för komponenttestning. Ni övar på Sveltejs Academy med praktisk kod som körs direkt i webbläsaren, medan en AI-handledare som är tillgänglig dygnet runt svarar på Era frågor under lektionen.

Behöver jag någon erfarenhet för att börja lära mig Sveltejs Academy?

Du behöver inga förkunskaper. Utbildningen i Sveltejs Academy på CoddyKit är upplagd för allt från nybörjare till avancerade elever, så att du kan börja här eller från början och gå fram i din egen takt. Detta är lektion 1 av 4.

Hur lång tid tar lektionen ”Konfigurera Vitest för Svelte-projekt”?

De flesta CoddyKit-lektioner tar cirka 5–10 minuter. Varje lektion är kort och interaktiv, så att du gör stadiga framsteg och kan fortsätta precis där du slutade – på webben eller i appen.

Kan jag skriva och köra kod i den här Sveltejs Academy-lektionen?

Ja. Varje Sveltejs Academy-lektion innehåller en inbyggd kodredigerare, så att du kan skriva och köra riktig kod direkt i webbläsaren och få omedelbar AI-feedback – utan lokal installation.

Alla lektioner i den här kursen

  1. Konfigurera Vitest för Svelte-projekt
  2. @testing-library/svelte: render och fireEvent
  3. Testa stores och reaktivitet
  4. Mockning av moduler och Fetch
← Tillbaka till Sveltejs Academy