Генератор tsconfig.json
В tsconfig.json далеко за сотню опций компилятора, и каждый туториал по TypeScript показывает свою комбинацию. Этот генератор держится тех, что важны большинству проектов: target, module, moduleResolution, jsx, привычные булевы флаги (strict, esModuleInterop, skipLibCheck и компания) и папки outDir/rootDir. Предпросмотр tsconfig.json обновляется вживую при каждом изменении; скопируйте его в корень проекта, и у вас будет чистый конфиг без мёртвых опций, которые тащит большинство шаблонов.
Как собирается конфиг
-
1
Выберите target и module
Версия JavaScript, которую выдаёт tsc (от ES2015 до ES2023 или ESNext), и система модулей (CommonJS, ES2015/ES2020/ES2022, ESNext, Node16, NodeNext).
-
2
Задайте moduleResolution и JSX
bundler для проектов на Vite/webpack, node16/nodenext для современного Node, node или classic для старых конфигураций. Поставьте jsx в react-jsx для современного React или оставьте none, чтобы ключ не записывался.
-
3
Переключите флаги
strict, esModuleInterop, skipLibCheck, resolveJsonModule, allowJs, declaration, sourceMap и forceConsistentCasingInFileNames в виде простых чекбоксов.
-
4
Задайте папки
outDir и rootDir, предзаполненные ./dist и ./src. include и exclude фиксированы: src/**/* плюс node_modules и dist.
-
5
Скопируйте готовый tsconfig
JSON-предпросмотр обновляется вживую; один клик копирует его, останется положить в корень проекта как tsconfig.json.
Опции, которые записывает этот генератор
| Опция | По умолчанию здесь | Что делает |
|---|---|---|
target |
ES2022 |
Версия JavaScript в выходном коде. ES2022 безопасна для актуальных браузеров и Node; более старый target нужен только для legacy-окружений. |
module |
ESNext |
Синтаксис модулей на выходе. Для Node-проектов на ESM берите NodeNext/Node16, для старого Node CommonJS. |
moduleResolution |
node |
Как ищутся импорты. С Vite/webpack/esbuild лучше bundler, с современным Node node16/nodenext; node (node10) остаётся историческим поведением. |
jsx |
не пишется | Записывается только при выборе режима. react-jsx для React 17+, preserve, если JSX преобразует бандлер. |
strict |
true |
Включает всё семейство строгих проверок. В новых проектах не выключайте. |
esModuleInterop |
true |
Чинит дефолтные импорты из CommonJS-пакетов. |
skipLibCheck |
true |
Пропускает проверку типов в .d.ts; компиляция заметно быстрее, реальные баги прячет редко. |
forceConsistentCasingInFileNames |
true |
Отклоняет импорты, регистр которых не совпадает с файлом на диске (классическая поломка при переезде с macOS на Linux). |
resolveJsonModule |
true |
Разрешает import data from "./data.json". |
allowJs |
false |
Допускает .js-файлы в компиляцию; удобно в разгар миграции. |
declaration |
false |
Генерирует .d.ts-файлы; включайте при публикации библиотеки. |
sourceMap |
false |
Генерирует .js.map для отладки. |
outDir / rootDir |
./dist / ./src |
Куда складывается скомпилированный код и где лежат исходники. |
baseUrl |
"." |
Записывается всегда, чтобы добавленный вручную блок paths разрешался от корня проекта. |
Точный вывод по умолчанию
Не трогайте ни один переключатель, и вы получите ровно такой файл:
{
"compilerOptions": {
"target": "ES2022",
"module": "ESNext",
"moduleResolution": "node",
"strict": true,
"esModuleInterop": true,
"skipLibCheck": true,
"forceConsistentCasingInFileNames": true,
"resolveJsonModule": true,
"allowJs": false,
"declaration": false,
"sourceMap": false,
"outDir": "./dist",
"rootDir": "./src",
"baseUrl": "."
},
"include": [
"src/**/*"
],
"exclude": [
"node_modules",
"dist"
]
}
Выберите режим jsx, отличный от none, и в compilerOptions добавится запись "jsx".
Строгий режим: что он включает на самом деле
strict: true это флаг-зонтик, включающий всё strict-семейство, в том числе noImplicitAny, strictNullChecks, strictFunctionTypes, strictBindCallApply, strictPropertyInitialization, noImplicitThis, useUnknownInCatchVariables и alwaysStrict. Новые проекты стоит начинать со всем включённым: добавлять строгость задним числом больно.
Частые ошибки
- Ставить
module: "CommonJS"для Node-проекта на ESM. Если вpackage.jsonстоит"type": "module", используйтеNodeNextи дляmodule, и дляmoduleResolution. - Использовать
tscкак бандлер. Это компилятор и проверка типов. Сборка через Vite/esbuild/SWC, проверка типов черезtsc --noEmit. - Компилировать всё подряд. Без списка
includeTypeScript подхватывает каждый видимый.ts. Сгенерированный конфиг всегда пишетinclude: ["src/**/*"]и исключаетnode_modulesиdist, так что вы защищены. - Нужно больше, чем даёт конфиг. Этот генератор осознанно минимален. Опции вроде
lib,paths,isolatedModulesилиnoEmitлегко дописать руками, когда базовый файл уже на месте.
Часто задаваемые вопросы
Для монорепозиториев и многопакетных проектов да: один базовый файл с общими опциями, а каждый пакет наследует его через “extends”. Для репозитория с одним проектом проще один tsconfig.json, как сгенерированный.
Появился в TypeScript 5.0 для проектов, которые собираются Vite, webpack или esbuild. Он повторяет то, как бандлеры реально разрешают импорты, без правил ESM о расширениях файлов из node16/nodenext. Для кода, который выполняет сам Node, берите node16 или nodenext.
Отдельного поля для этого нет. Зато сгенерированный файл всегда ставит baseUrl в “.”, так что блок paths можно вставить прямо под ним, например “@/*”: [“src/*”], и он будет разрешаться от корня проекта.
Обычно нет, поэтому генератор его и не пишет: target сам подразумевает подходящий набор типов библиотек. Переопределяйте lib вручную только в особых случаях, например DOM API в Node-проекте или типы WebWorker.
Регистрация не нужна, и ничего не сохраняется. Выбранные опции используются только для отрисовки предпросмотра, а в пошаговом режиме они попадают и в URL страницы, так что готовый конфиг легко добавить в закладки или переслать.
Сопутствующие инструменты
Справочная таблица ASCII
Полная таблица ASCII от 0 до 127 с десятичным, шестнадцатеричным, восьмеричным и двоичным представлением, а также записью числовых ссылок HTML, включая NUL, LF и DEL.
Справочник символов HTML
Справочник HTML-сущностей с поиском, их именованными и числовыми кодами, а также копированием специальных символов и знаков одним кликом.
Смешивание цветов
Смешайте два HEX-цвета в 2-20 равномерных образцов. Каждый промежуточный цвет показывается как HEX-код в верхнем регистре, включая оба края.
Справочник сочетаний клавиш
Ищите документированные сочетания по умолчанию для VS Code, Chrome и Bash с GNU Readline в macOS, Windows и Linux.
Счетчик FPS
Измерьте FPS браузера через requestAnimationFrame: сглаживание, минимальная и максимальная частота кадров, порог предупреждения и график по желанию. Работает локально, без загрузок и API.
Генератор случайных букв
Генерируйте случайные буквы A-Z. Выберите количество, верхний или нижний регистр либо смешанный вариант для игр, заданий и уроков.
Инструмент доступен на других языках
- เครื่องมือสร้างไฟล์ tsconfig.json [TH]
- Generador de tsconfig.json [ES]
- Generator tsconfig.json [PL]
- tsconfig.json ジェネレーター [JA]
- Gerador de tsconfig.json [PT]
- tsconfig.json-generator [SV]
- Bộ tạo tsconfig.json [VI]
- مولد ملف tsconfig.json [AR]
- Générateur de tsconfig.json [FR]
- tsconfig.json-Generator [DE]
- Generator tsconfig.json [ID]
- tsconfig.json 생성기 [KO]
- Tsconfig.json-generator [NL]
- tsconfig.json Üretici [TR]
- tsconfig.json 生成器 [ZH]
- tsconfig.json Generator [EN]
- Generatore tsconfig.json [IT]