Установка и настройка
Установка
Локально в проект:
npm install -D typescript
Глобально:
npm install -g typescript
Проверка:
npx tsc --version
Инициализация
npx tsc --init
Создаётся tsconfig.json — конфигурация компилятора.
Базовый tsconfig.json
{
"compilerOptions": {
"target": "ES2022",
"module": "ESNext",
"moduleResolution": "bundler",
"strict": true,
"esModuleInterop": true,
"skipLibCheck": true,
"forceConsistentCasingInFileNames": true,
"outDir": "dist",
"rootDir": "src"
},
"include": ["src"]
}
Ключевые опции
target
В какую версию JS компилировать. ES2022, ESNext, ES5. Современные проекты — ES2022 или выше.
module
Система модулей. ESNext для браузера и современных сборщиков, CommonJS для старого Node.js.
strict
Включает все строгие проверки. Всегда включай. Отдельные флаги:
noImplicitAny— запрещает неявныйanystrictNullChecks—nullиundefinedне присваиваются другим типамstrictFunctionTypes— строгая проверка функцийstrictPropertyInitialization— свойства класса должны быть инициализированы
esModuleInterop
Правильная работа с CommonJS-модулями. Включай для совместимости.
skipLibCheck
Не проверять типы в node_modules. Ускоряет компиляцию.
Компиляция
npx tsc
Прочитает tsconfig.json, скомпилирует все .ts из include.
Один файл:
npx tsc main.ts
Следить за изменениями:
npx tsc --watch
Проверка без компиляции
npx tsc --noEmit
Проверит типы, но не создаст .js. Полезно в CI.
Пример
src/main.ts:
const greeting: string = 'Hello';
console.log(greeting);
После npx tsc появится dist/main.js.
Интеграция со сборщиками
В Vite, Next.js, Webpack TypeScript компилируется автоматически. Устанавливаешь typescript и создаёшь tsconfig.json — всё работает.
Редактор
VS Code поддерживает TypeScript из коробки: автодополнение, ошибки, переходы. Работает по tsconfig.json.
Итоги
- Установка —
npm install -D typescript tsc --initсоздаёт конфигstrict: true— обязательноtscкомпилирует,--noEmitтолько проверяет- Сборщики компилируют автоматически