Генератор tsconfig.json

ДанныеРазработчик
Реклама · УДАЛИТЬ?

Язык и модули

Версия JavaScript, в которую будет скомпилировано.
Система модулей для выдаваемого кода.
Как компилятор разрешает импорты.
Режим компиляции JSX. Обязательно для проектов React.
Список стандартных библиотек, разделённых запятыми (оставьте пустым, чтобы использовать значение по умолчанию). Примеры: ES2022, DOM, DOM.Iterable, WebWorker, ESNext.

Размещение проекта

Корневая папка входных файлов. Оставьте пустым, чтобы определить автоматически.
Папка выходных файлов. Оставьте пустым, чтобы вывести рядом с исходным кодом.
Основная директория для неотносительных импортов. Требуется, если вы настроили алиасы путей.
Алиасы путей, один на строку в формате alias=target. Используйте * для шаблонов. Пример: @/*=src/*
Шаблоны glob для включения, один на строку. По умолчанию включаются все файлы в проекте, если пусто.
Шаблоны glob для исключения, один на строку.

Строгость

Проверка

Генерация и взаимодействие

Опции вывода

Реклама · УДАЛИТЬ?

Гид

tsconfig.json Generator

Генератор tsconfig.json

Создать действительный tsconfig.json для TypeScript-проектов без необходимости запоминать названия опций или искать в заметках о последних изменениях в компиляторе. Выберите профиль (Node ESM, Node CommonJS, React, Next.js, Библиотека или Строгий), настройте переключатели строгости, добавьте алиасы путей и скопируйте сгенерированный JSON в корень вашего проекта.

Конфигурация компилятора TypeScript — это острые поверхности: названия опций чувствительны к регистру, список растёт с каждым выпуском, и опечатка или устаревшее имя ключа могут молча генерировать неправильный результат вместо быстрого отказа. Генератор на основе формы, который выводит только опции, которые вы отметили, — самый быстрый способ получить рабочую конфигурацию, соответствующую вашему проекту и его рабочему и сборочному процессу.

Как использовать

  1. Откройте Предустановленный профиль список и выберите наиболее близкий вариант для вашего проекта. Форма заполняет разумные значения по умолчанию для цели, системы модулей, режима JSX и рекомендуемых флагов.
  2. Настройте Язык и модули секция, если ваша среда выполнения требует другого target, module, или moduleResolution. Установите jsx если вы компилируете React.
  3. Установите Размещение проекта поля (rootDir, outDir, baseUrl) для соответствия структуре папок. Добавьте алиасы путей по одной на строку в формате alias=target (например @/*=src/*).
  4. Используйте Строгость и Проверка чекбоксы для включения отдельных проверок компилятора. strict включает всю семью строгих настроек за один клик.
  5. The Генерация и взаимодействие секция управляет тем, как создаются файлы и как работают импорты по умолчанию. Включите declaration для библиотек или noEmit когда бандлер управляет выходными файлами.
  6. Скопируйте конфигурацию из панели вывода или скачайте её напрямую как tsconfig.json.

Возможности

  • Профили предустановок — Node (ESM и CommonJS), React, Next.js App Router, Библиотека и строгий профиль для новых проектов.
  • Все современные версии целей — от ES5 до ES2023 и ESNext, с соответствующими системами модулей, включая NodeNext и разрешение бандлера.
  • Генератор алиасов путей — введите один алиас на строку; генератор автоматически соединяет baseUrl при наличии алиасов.
  • Строгая настройка — включите noUncheckedIndexedAccess, exactOptionalPropertyTypesи другие отдельные флаги семейства строгих настроек.
  • Поддержка JSX – Выберите между react-jsx, react-jsxdev, классический react, или preserve для бандлеров.
  • Комментарии в строках — Каждый из вариантов может быть аннотирован кратким объяснением, чтобы конечный файл документировал себя.
  • Включения и исключения по шаблонам — многострочное вводимое поле для include и exclude шаблонов с разумными значениями по умолчанию для каждого профиля.
  • Режим библиотеки — профиль библиотеки включает declaration, declarationMapи sourceMap таким образом, потребители получают полные типы.
  • Копирование или загрузка — Вставьте результат в репозиторий одним кликом.

Реклама · УДАЛИТЬ?

Часто задаваемые вопросы

  1. Что такое tsconfig.json и зачем TypeScript ему нужен?

    tsconfig.json — это конфигурационный файл, который читается компилятором TypeScript для определения, какие файлы относятся к проекту и как их компилировать. Его наличие в директории означает, что эта директория является корнем проекта. Без него компилятор всё ещё работает с отдельными файлами, но инструменты, такие как редакторы, сборочные цепочки и интеграции проверки, зависят от него для получения единообразного представления о коде, целевой среде выполнения и строгости проверки типов.

  2. Какова разница между модулем и moduleResolution?

    module управляет синтаксисом JavaScript, который генерирует TypeScript — CommonJS require/exports, модули ES с import/export или гибрид, такой как NodeNext. moduleResolution является независимым и управляет тем, как ищутся импорты на диске — например, разрешает ли импорт без расширения файл с расширением .ts, учитывает ли поля в package.json, и предполагает ли использование разрешителя бандлера. Современные проекты с бандлером обычно используют module: ESNext и moduleResolution: Bundler; чистые проекты Node без бандлера используют module: NodeNext и moduleResolution: NodeNext.

  3. Что именно включает флаг strict?

    strict — это метафлаг, который включает всю семью строгих настроек в одном переключателе: noImplicitAny, strictNullChecks, strictFunctionTypes, strictBindCallApply, strictPropertyInitialization, noImplicitThis, alwaysStrict и useUnknownInCatchVariables. Все новые строгие флаги, добавленные в будущих версиях компилятора, также включаются автоматически. Индивидуальные флаги все еще могут быть установлены явно для перекрытия строгого значения по умолчанию, но большинству новых проектов следует оставить strict включенным и добавлять более агрессивные опции, такие как noUncheckedIndexedAccess.

  4. Как работают пути алиасов с baseUrl?

    paths определяет отображение из импортируемых спецификаторов к реальным путям файлов, и поиск происходит относительно baseUrl. Например, baseUrl: "." и paths: { "@/*": ["src/*"] } означает, что импорт из @/utils разрешается на ./src/utils. Алиасы путей влияют только на проверку типов; для того чтобы они работали на уровне выполнения, бандлеры, тестовые запускающие программы и сама среда должны иметь собственную конфигурацию (Vite resolve.alias, Jest moduleNameMapper, поле Node imports).

  5. Когда следует включать noEmit?

    noEmit предназначен для проектов, где другое средство — обычно бандлер, такой как Vite, esbuild, webpack или Next.js — генерирует выходной JavaScript, а TypeScript используется исключительно для проверки типов. При включении noEmit компилятор проверяет типы, но не создает файлы. Это также полезно в CI для быстрой стадии проверки типов. Для проектов, которые публикуются в npm, оставьте noEmit выключенным, чтобы компилятор мог генерировать файлы .js и .d.ts вместе с исходным кодом.

Хотите убрать рекламу? Откажитесь от рекламы сегодня

Установите наши расширения

Добавьте инструменты ввода-вывода в свой любимый браузер для мгновенного доступа и более быстрого поиска

в Расширение Chrome в Расширение края в Расширение Firefox в Расширение Opera

Табло результатов прибыло!

Табло результатов — это интересный способ следить за вашими играми, все данные хранятся в вашем браузере. Скоро появятся новые функции!

Реклама · УДАЛИТЬ?
Реклама · УДАЛИТЬ?
Реклама · УДАЛИТЬ?

новости с техническими моментами

Примите участие

Помогите нам продолжать предоставлять ценные бесплатные инструменты

Купи мне кофе
Реклама · УДАЛИТЬ?