Настройка Vitest/Jest для TS
Установите и настройте Vitest или Jest для проектов TypeScript; напишите небольшой тест и запустите его.
«Настройка Vitest/Jest для TS» — бесплатный урок TypeScript Academy на CoddyKit. Это урок 1 из 3. Ты можешь прочитать весь урок бесплатно ниже — а потом практиковать его прямо в браузере с встроенным редактором кода и ИИ-репетитором 24/7. Это часть пути обучения TypeScript Academy, и твой прогресс синхронизируется между веб-версией и приложением CoddyKit. Курс TypeScript Academy содержит 3 уроков всего.
Введение
Цель: настроить Vitest или Jest для TypeScript. Вы установите зависимости, добавите конфигурацию, напишете один небольшой тест и запустите его.
Установка Vitest
Vitest нативно работает с Vite: быстро запускается, в первую очередь использует ESM и обеспечивает отличное удобство разработки (DX). Установите его вместе с @types/node для глобальных сущностей.
npm install --save-dev vitest @vitest/ui @types/nodeПример Vitest
Добавьте vitest.config.ts, напишите небольшой тест и запустите его с помощью npx vitest или скрипта npm test.
// vitest.config.ts
import { defineConfig } from "vitest/config";
export default defineConfig({
test: { globals: true }
});
// src/sum.ts
export const sum = (a: number, b: number) => a + b;
// src/sum.test.ts
import { sum } from "./sum";
import { describe, expect, it } from "vitest";
describe("sum", () => {
it("adds numbers", () => {
expect(sum(2, 3)).toBe(5);
});
});Установка Jest
Jest нужен преобразователь для TS. Используйте ts-jest, чтобы компилировать тесты на лету.
npm install --save-dev jest ts-jest @types/jest @types/nodeПример Jest
Укажите preset: "ts-jest". Jest запустит тесты .ts без отдельного шага сборки.
// jest.config.js
module.exports = {
preset: "ts-jest",
testEnvironment: "node",
};
// src/sum.test.ts
import { sum } from "./sum";
test("adds numbers", () => {
expect(sum(2, 3)).toBe(5);
});Скрипты
Добавьте скрипты для удобного рабочего процесса. Используйте режим наблюдения, чтобы быстро получать обратную связь во время разработки.
// package.json (scripts)
{
"scripts": {
"test": "vitest",
"test:ui": "vitest --ui",
"test:jest": "jest"
}
}Вопрос
Быстрая проверка: что делает ts-jest в конфигурации Jest + TS?
Повторение
Повторение: Vitest (нативный для Vite) и Jest (широко используемый) отлично работают с TS. Настройте их один раз, а затем запускайте тесты в режиме наблюдения или в системе непрерывной интеграции.
Часто задаваемые вопросы
Урок «Настройка Vitest/Jest для TS» бесплатный?
Да — полный текст урока «Настройка Vitest/Jest для TS» бесплатно доступен здесь в веб-версии. Чтобы практиковать его интерактивно (встроенный редактор кода и ИИ-репетитор 24/7) и разблокировать остальной курс TypeScript Academy, подпишись на CoddyKit PRO. Курс TypeScript Academy содержит 3 уроков всего.
Чему я научусь в уроке «Настройка Vitest/Jest для TS»?
Установите и настройте Vitest или Jest для проектов TypeScript; напишите небольшой тест и запустите его. Ты практикуешь TypeScript Academy с помощью реального кода, который запускаешь прямо в браузере, и ИИ-репетитор 24/7 отвечает на твои вопросы во время урока.
Нужен ли мне опыт, чтобы начать TypeScript Academy?
Предыдущий опыт не требуется. TypeScript Academy на CoddyKit структурирован для всех уровней — от новичков до продвинутых, поэтому ты можешь начать отсюда или с самого начала и учиться в своем темпе. Это урок 1 из 3.
Сколько времени занимает урок «Настройка Vitest/Jest для TS»?
Большинство уроков CoddyKit занимают около 5–10 минут. Каждый из них компактный и интерактивный, поэтому ты постоянно делаешь прогресс и продолжаешь с того же места в веб-версии и приложении.
Можно ли писать и запускать код в этом уроке TypeScript Academy?
Да. Каждый урок TypeScript Academy включает встроенный редактор кода, поэтому ты пишешь и запускаешь реальный код прямо в браузере и получаешь моментальную обратную связь от AI — локальная установка не требуется.
Все уроки этого курса
- Настройка Vitest/Jest для TS
- Типизация тестов и имитаций; expectTypeOf
- Обзор типизации E2E-тестов (Playwright/Cypress)