Посібник по TypeScript

Файл конфігурації tsconfig.json

За допомогою файлу tsconfig.json можна налаштувати проєкт TypeScript. Зокрема, цей файл виконує такі завдання:

  • встановлює кореневий каталог проєкту TypeScript
  • виконує налаштування параметрів компіляції
  • встановлює файли проєкту

Для його використання достатньо вручну додати новий файл з іменем tsconfig.json у корінь проєкту.

Файл tsconfig.json у TypeScript

Структура файлу

tsconfig.json являє собою стандартний файл у форматі json, який містить низку секцій. Так, секція "compilerOptions" налаштовує параметри компіляції. Тут можна вказати необхідні параметри та їхні значення. Параметри називаються також, як і в командному рядку. І відповідно значення ми їм можемо передати ті самі, що передаються в командному рядку (або терміналі). Наприклад:

{
    "compilerOptions": {
        "target": "es5",
        "removeComments": true,
        "outDir": "js",
        "sourceMap": true
        "outFile": "main.js"
    }
}

Тут використовуються всі ті самі параметри, які застосовуються під час компіляції в командному рядку. Наприклад, параметр "target" вказує, який стандарт JavaScript застосовуватиметься під час компіляції.

Параметр "removeComments" видаляє коментарі. Параметр "outDir" задає каталог для скомпільованих файлів. "sourceMap" вказує, що треба згенерувати карту для зіставлення вихідних і скомпільованих файлів. І параметр "outFile" задає назву вихідного файлу.

За необхідності можна вмикати інші опції компіляції.

За допомогою секції files можна встановити набір файлів, що включаються в проект:

{
    "compilerOptions": {
        "target": "es5",
        "removeComments": true,
        "outFile": "../../built/local/tsc.js"
    },
    "files":[
        "app.ts",
        "interfaces.ts",
        "classes.ts",
    ]
}

Якщо секція "files" не вказана у файлі tsconfig.json, то компілятор за замовчуванням включає всі файли TypeScript (файли з розширенням *.ts і *.tsx), що містяться в каталозі та підкаталогах проєкту. Якщо ж вказано секцію "files", то використовуються тільки файли з цієї секції.

Параметр exclude, навпаки, дає змогу виключити під час компіляції певні файли:

{
    "compilerOptions": {
        "target": "es5",
        "removeComments": true,
        "outFile": "../../built/local/tsc.js"
    },
    "exclude":[
        "wwwroot",
        "node_modules"
    ]
}

Під час компіляції компілятор не враховуватиме файли TypeScript, які знаходяться в каталогах із секції exclude.

Водночас слід враховувати, що якщо у файлі одночасно буде задано обидві секції files та exclude, то секція exclude буде ігноруватися.

Усі файли, на які є посилання у файлах із секції "files", також компілюються.

Параметр compileOnSave у значенні true вказує використовуваній IDE згенерувати всі файли js під час кожного збереження файлів TypeScript:

{
    "compileOnSave": true,
    "compilerOptions": {
        "target": "es5"
    }
}

Використання файлу tsconfig.json

Файл tsconfig.json використовується під час компіляції в тому разі, якщо компілятору не передають назви файлів, які треба скомпілювати. У цьому разі компілятор TypeScript переглядає поточний каталог, шукає в ньому файл tsconfig.json і потім під час компіляції використовує ті параметри, які визначені в цьому файлі.

Якщо ж компілятору передаються назви файлів, наприклад, tsc app.ts, то файл tsconfig.json ігнорується.

Повний список застосовуваних опцій у tsconfig.json можна переглянути в документації.