Выполнение TypeScript в коде Visual Studio с помощью Code Runner

TypeScript – популярный язык программирования, расширяющий JavaScript за счет добавления статической типизации. Visual Studio Code (VS Code) — мощный и широко используемый редактор кода. Code Runner — это расширение VS Code, которое позволяет запускать фрагменты кода на разных языках непосредственно в редакторе. В этой статье мы рассмотрим различные методы запуска кода TypeScript в VS Code с помощью Code Runner.

Метод 1: запуск одного файла TypeScript
Самый простой способ запустить код TypeScript в VS Code — выполнить один файл. Выполните следующие действия:

1. Установите расширение Code Runner из магазина VS Code.
2. Создайте новый файл TypeScript или откройте существующий.
3. Откройте файл в VS Code и перейдите к коду, который хотите запустить.
4. Используйте сочетание клавиш Ctrl+Alt+N или щелкните правой кнопкой мыши и выберите «Запустить код», чтобы выполнить файл.

Пример:

// myFile.ts
function greet(name: string) {
  console.log(`Hello, ${name}!`);
}
greet("John");

Метод 2: запуск проекта TypeScript
Если вы работаете над проектом TypeScript с несколькими файлами, вы можете запустить весь проект с помощью Code Runner. Выполните следующие действия:

1. Установите расширение Code Runner, если вы еще этого не сделали.
2. Откройте папку проекта TypeScript в VS Code.
3. Нажмите Ctrl+`, чтобы открыть встроенный терминал в VS Code.
4. Выполните следующую команду, чтобы скомпилировать и выполнить проект:

   tsc && node dist/index.js

Пример структуры проекта:

myProject/
  src/
    index.ts
  dist/
    index.js
  tsconfig.json

Пример:

// index.ts
function greet(name: string) {
  console.log(`Hello, ${name}!`);
}
greet("John");

Метод 3: настройка параметров выполнения кода
Code Runner предоставляет гибкие параметры конфигурации для настройки поведения выполнения кода. Вы можете изменить настройки в соответствии с вашими конкретными требованиями. Чтобы получить доступ к настройкам Code Runner, выполните следующие действия:

1. Откройте настройки VS Code, нажав Ctrl+или выбрав «Файл» >«Настройки» >«Настройки».
2. Найдите «Code Runner» в строке поиска настроек.
3. Отрегулируйте настройки в соответствии со своими предпочтениями. Например, вы можете изменить команду выполнения или включить/отключить сохранение файла перед запуском кода.

Пример настроек в settings.json:

"code-runner.executorMap": {
  "typescript": "npx tsc -p $dir && node $dirWithoutExt/dist/index.js"
}