Последнее обновление 02.01.2023 — Василий Иванов
TypeScript — это расширенный набор JavaScript, разработанный для создания более безопасных крупномасштабных приложений. Он добавляет в язык необязательную статическую типизацию, что упрощает обнаружение ошибок перед компиляцией.
В языке также представлены некоторые функции, которых нет в JavaScript. К ним относятся дженерики, классы, интерфейсы, перечисления и декораторы.
Узнайте, как настроить свой первый проект TypeScript с нуля всего за несколько шагов.
Шаг 1: Установка TypeScript
Прежде чем использовать TypeScript в вашей системе, вы должны установить компилятор TypeScript глобально.
Выполните следующую команду, чтобы установить TypeScript глобально:
npm install -g typescript
Шаг 2: Настройка вашего проекта
Чтобы настроить проект TypeScript, начните с создания пустого каталога проекта в любой IDE по вашему выбору.
Затем создайте файлы с расширением .ts. TypeScript не может работать ни в какой среде. Таким образом, перед запуском он должен быть скомпилирован в JavaScript.
Чтобы скомпилировать файлы TypeScript в JavaScript, перейдите в каталог проекта на терминале. Затем запустите tsc, а затем имя вашего файла TypeScript.
Например:
tsc index.ts
Эта команда создаст файл index.js в том же каталоге, где находится ваш файл index.ts.
Такое поведение может быть нежелательным, так как это затруднит управление вашим проектом с несколькими файлами .js и .ts в одном каталоге.
Вы можете изменить это поведение по умолчанию и изменить поведение своего компилятора TypeScript с помощью файла tsconfig.json.
Выполните следующую команду в своем терминале, чтобы создать файл tsconfig.json в вашем проекте:
tsc --init
Это создает файл, содержащий все параметры конфигурации для вашего компилятора TypeScript.
Здесь вы охватите только основы, необходимые для запуска вашего проекта, но вы можете узнать больше об этом в документации TypeScript tsconfig.
Шаг 3. Настройка компилятора TypeScript для лучшего рабочего процесса
Файл tsconfig.json содержит параметры конфигурации для компилятора TypeScript, разделенные на семь разделов:
- Проекты
- Язык и среда
- Модули
- Поддержка JavaScript
- Испускают
- Ограничения взаимодействия
- Проверка типов
- Полнота
Большинство свойств по умолчанию отключены (закомментированы). Вы можете активировать и изменить их, раскомментировав их.
Вот шаги, которые вам необходимо выполнить, чтобы изменить расположение сгенерированных файлов JavaScript:
- Откройте tsconfig.json и найдите раздел emit.
- В разделе emit раскомментируйте свойство outDir и укажите каталог, в котором вы хотите хранить скомпилированные файлы .ts. Теперь каждый раз, когда вы запускаете tsc, ваши файлы .js будут находиться в указанной папке.
Запуск tsc, за которым следует имя файла, который вы хотите скомпилировать, не является оптимальным для вашего рабочего процесса, особенно когда вам нужно скомпилировать несколько файлов.
Чтобы решить эту проблему, компилятор TypeScript предоставляет свойство, позволяющее компилировать все файлы в каталоге одной командой.
Выполните следующие действия, чтобы настроить это:
- Откройте tsconfig.json и найдите раздел модулей.
- В разделе модулей раскомментируйте свойство rootDir или rootDirs (если вы хотите, чтобы компилятор скомпилировал несколько каталогов .ts в .js) и укажите каталоги файлов.
Эти настройки улучшат ваш рабочий процесс и упростят обслуживание ваших файлов.
Преимущества TypeScript
Основным преимуществом TypeScript перед JavaScript является безопасность типов. TypeScript позволяет быстро обнаруживать трудно обнаруживаемые ошибки. Эта функция делает его идеальным для создания безопасных и крупномасштабных приложений.
