СправошнаяПоиск

Типовой tsconfig.json для React App

При добавлении поддержки Typescript в существующее приложение желательно добавить файл конфигурации. Простой пример.

{
  "compilerOptions": {
    "target": "es5", // Указываем целевую версию ECMAScript
    "lib": [
      "dom",
      "dom.iterable",
      "esnext"
    ], // Список файлов библиотеки для включения в компиляцию
    "allowJs": true, // Разрешить компиляцию файлов JavaScript
    "skipLibCheck": true, // Пропустить проверку типов всех файлов объявлений
    "esModuleInterop": true, // Отключает импорт пространства имен (import * as fs from "fs") и включает импорт в стиле CJS/AMD/UMD (import fs from "fs")
    "allowSyntheticDefaultImports": true, // Разрешить импорт по умолчанию из модулей без экспорта по умолчанию
    "strict": true, // Включить все параметры строгой проверки типов
    "forceConsistentCasingInFileNames": true, // Запретить ссылки в непоследовательном регистре на один и тот же файл.
    "module": "esnext", // Указываем генерацию кода модуля
    "moduleResolution": "node", // Разрешить модули используя стиль Node.js
    "isolatedModules": true, // Безоговорочно запускать импорт для неразрешенных файлов
    "resolveJsonModule": true, // Включить модули, импортированные с расширением .json
    "noEmit": true, // Не делать вывод (то есть не компилировать код, только выполнять проверку типов)
    "jsx": "react", // Поддержка JSX в файлах .tsx
    "sourceMap": true, // Создать соответствующий файл .map
    "declaration": true, // Создать соответствующий файл .d.ts
    "noUnusedLocals": true, // Сообщать об ошибках неиспользуемых локальных переменных
    "noUnusedParameters": true, // Сообщать об ошибках неиспользуемых параметров
    "incremental": true, // Разрешить инкрементную компиляцию путем чтения/записи информации из предыдущих компиляций в файл на диске
    "noFallthroughCasesInSwitch": true // Сообщать об ошибках для отказов в операторе switch
  },
  "include": [
    "src/**/*" // *** Файлы, которые TypeScript будет проверять на типизацию ***
  ],
  "exclude": ["node_modules", "build"] // *** Файлы, которые не надо проверять ***
}

 

Для нормального импорта tsx файлов через import лучше поменять "jsx" на "react-jsx". Тогда не придётся пописывать расширения .tsx для файлов импорта.

В зависимости от предпочтений версию от ECMAscript — на es6 или 2020. ES5 из стартового набора слишком уж устаревшая.