Любой JavaScript это по сути TypeScript, а все TypeScript-коды компилируются в хороший, чистый JavaScript. С официально разрешенным ES6 (EcmaScript2015), TypeScript продолжает предлагать отличную совместимость и новые функции и, таким образом, TypeScript остается отличным языком для разработки JavaScript. Этот фантастический язык теперь имеет великого компаньона: Visual Studio Code — нового редактора кода от Microsoft, который, кстати, был создан с помощью TypeScript! Поэтому, вполне естественно, что они прекрасно работают друг с другом.
Установка Visual Studio Code
Скачайте Visual Studio Code с официального сайта и запустите процесс установки. После завершения инсталляции вы можете приступить к написанию скриптов.
Если раньше вы пользовались разными версиями TypeScript, убедитесь, что %PATH% (системная переменная) обновлена и указывает на последнюю установленную версию. В противном случае некоторые вещи могут не работать.
Работа с TypeScript
Несмотря на то, JavaScript полностью поддерживается, потребуется кое-что сделать, чтобы добавить поддержку TypeScript в вашем проекте. Прежде всего, необходимо создать каталог, в котором будут храниться файлы проекта, например C:projectsVSTest . Создайте в этой папке файл tsconfig.json. Этот файл будет вашим файлом проекта TypeScript, и он содержит настройки проекта TypeScript, опции компилятора и т.д.
[ИЗБАВЬ СЕБЯ ОТ СТРАДАНИЙ] Автоматизация запуска кода в редакторе VS Code, запуск кода по кнопке
Выберите Файл -> Новый файл и нажмите на Файл -> Сохранить или клавиши Ctrl+S . Сохраните новый файл под именем tsconfig.json. Этот файл будет вашим файлом проекта TypeScript (что-то типа файла *.sln в C #), который содержит все настройки для компиляции и управления *.ts файлами. Подробнее о нем можно прочитать на официальном сайте, где имеется документация по tsconfig.json . Добавьте фигурные скобки <> чтобы открыть IntelliSense. Как только вы начнете печатать, вам будет показан такой экран:
Стандартная конфигурация выглядит следующим образом:
< «compilerOptions»: < «target»: «ES5», «noImplicitAny»: true, «removeComments»: true, «preserveConstEnums»: true, «out»: «output/project.js», «sourceMap»: true >, «files»: [ ] >
Теперь, когда у нас есть файл проекта, мы можем начать создавать ts-файлы с кодом. Выберите в меню Файл -> Новый файл. Добавьте в него следующие строки и сохраните как hello-world.ts:
class Startup < public static main():number< console.log(‘Привет, мир!’); return 1; >>
Здесь ничего сложного: обычный класс, который выводит текст на консоль и возвращает целое число 1 .
Билдинг и компиляция
Для начала нажмите Ctrl+Shift+B . Если это ваша первая попытка создания проекта, VS Code предложит вам создать Task Runner (Средство выполнения задач). Нажмите на Configure Task Runner (Настроить средство выполнения задач) для настройки конфигурационного файла.
Язык Си: компиляция в Visual Studio Code ПРОСТО
Task Runner использует файл конфигурации, который дает VS Code указание использовать специальные исполнительные файлы с определенными параметрами. В нашем случае нам интересен TypeScript компилятор
После завершения процесса вы должны увидеть папку .vscode с файлом task.json.
Откройте файл task.json для редактирования. Создайте конфигурацию для того, чтобы VS Code запустил tsc.exe с hello-world.ts в качестве аргумента по аналогии с приведенным ниже примером:
Хоть всё и выглядит нормально, давайте попробуем воспользоваться возможностями файла tsconfig.json чтобы поменять некоторые параметры билдинга. Вы можете изменить предыдущее задание, чтобы оно выглядело так:
Опишем кратко определение задания:
- version: версия таска
- command: какой исполнительный файл вызвать
- showOutput: [ silent , always , never ]
- isShellCommand: запускает команду tsc (VS Code напрямую исполняет ее)
- args : пустой, т.к. переписан tsconfig.json
- problemMatcher: строка массива строк, основанная на предопределенных сопоставителях задач. Сейчас нет смысла это трогать
Информация об ошибках, возникающих в процессе разработки очень важна. Вот почему я всегда устанавливаю «showOuput»: «always» . Это изменяет поведение Окна Вывода, заставляя его всегда быть на виду в процессе разработки. Доступные значения определяют, как ведет себя окно вывода:
- silent: окно вывода появляется только в случае, если нет никаких ошибок в коде. Это значение по умолчанию
- always: окно вывода всегда на виду
- never: пользователь должен самостоятельно открывать окно вывода через меню «Вид», либо через сочетание клавиш Ctrl+Shift+U
На данном этапе можно нажать Ctrl+Shift+B чтобы начать разработку. Однако, хоть это и не выведет никаких сообщений об ошибках, никаких *.js или sourcemap файлов также не будет создано. Это потому, что мы не включили наш файл hello-world.ts в настройках tsconfig.json>files[] . Добавьте это, сохраните файл и начните заново.
Теперь в каталоге вашего проекта вы должны увидеть следующие файлы:
С добавлением новых файлов и ростом вашего проекта, обязательно убедитесь в том, что включили все *.ts -файлы, которые хотите скомплировать, в tsconfig.json file . Это поможет убедиться в том, что весь ваш код переводится в JavaScript и сливается в один файл, как в наших предыдущих настройках.
Ошибки при создании
Visual Studio Code отличная система предупреждения об ошибках. У вас появляется несколько вариантов отображения ошибок. Первый – через IntelliSense, как на картинке ниже:
Второй – маленький значок, говорящий о том, что что-то идет не так. Значок располагается в левом нижнем углу на панели задач:
Нажмите на иконку, и в верхней части окна перед вами выскочит окошко, показывающее номер строки и колонки, где находится ошибка, а также описание и тип ошибки, как на картинке ниже:
Резюме
Visual Studio Code отлично подходит при работе с TypeScript. В следующем посте Gulp и Visual Studio Code я расскажу как добавить Gulp к проекту для выполнения различных задач: компиляции ваших *.ts файлов, минимизации кода, компиляции LESS/SASS и т.д.
Источник: websketches.ru
Статья Visual Studio Code — установка и настройка для работы с Go (Golang)
Всем хорошего дня. В данной статье я пошагово расскажу и покажу установку IDE Visual Studio Code, компилятора и других утилит языка Go (Golang), клиента Git.
А затем расскажу как запустить вашу программу в отладчике.
Начнем.
Установка Go
Обратите внимание на устанавливаемую версию языка — если скачаете из источников отличных от оффсайта, то скорее всего получите устаревшую версию.
Поэтому советую сразу заходить на оффсайт
Ссылка скрыта от гостей
и скачивать оттуда версию по вашей операционной системе. Я использую Windows:
Скачав файл, двойной клик и так далее. Если устанавливаете в директорию на диске C:, по умолчанию, то потребуются права администратора.
Проверяем успешность установки в командной строке (cmd в Windows/terminal Linux/macOS):
go version
Установка VS Code
Теперь установим сам Visual Studio Code со страницы
Ссылка скрыта от гостей
Опять же, выбираем по своей операционной системе. Я выбираю Windows.
По умолчанию (и рекомендации) загружается User Installer версия — эту версию можно установить и обычному пользователю и админу.
Установка будет в локальную директорию пользователя. System installer требует права админа и устанавливает для всех пользователей в системе.
Размер файла на скачивание примерно 90 Мб.
После скачивания как обычно — двойной клик и поехали.
Для моего пользователя установка будет в C:UsersPolyglotAppDataLocalProgramsMicrosoft VS Code , требуемое место 333 Мб.
По окончание установки Visual Code (далее VS Code) будет запущен и увидим такое окно:
Первым делом установим Go Extension — расширение VS Code собственно и дающее способность узнавать и подсвечивать синтаксис Go, показывать подсказки о дополнении функций,
свертывать/развертывать код и многое другое. Для этого жмем на кнопку Extensions слева на тулбаре, вводим в поле поиска Go, выбираем расширение от Google и жмем на Install —
шаги 1, 2, 3, и 4 в скрине:
Следующий шаг это установить дополнительные утилиты — линтер для проверки кода на рекомендуемые практики, форматировщик кода, и главное — отладчик (дебаггер) Delve .
Сделаем это с помощью командного “центра” VS Code — Command Palette. Это отправная точка поиска/установки/компилирования/изменения параметров самого VS Code,
поэтому сразу запоминаем шорткат — Ctrl + Shift + P на Windows/Cmd + Shift + P на Маке.
В поле поиска пишем такую фразу:
и нажимаем на появившийся результат.
Выбираем все утилиты:
И жмем OK.
В правом нижнем углу VS Code, в окне Output, появится окно результатов установки, все должно быть Succeeded:
Для надежности перезапускаем VS Code.
Проверим что все готово к написанию кода.
Откроем Проводник ( Ctrl + Shift + E), нажмем на Open Folder, зайдем в папку где можем создавать файлы и создадим новую папку
На Windows может появится предупреждение “Доверяете ли вы себе?”, ответ очевиден:
После создания и добавления в VS Code папки hello_world, создадим в ней новый файл по имени
hello.go
Справа откроется окно редактора кода:
Кликнув внутри, введем следующий код:
Если установка расширения Go в VS Code была действительно успешной, то при вводе слова package появится подсказка:
Вся программа будет выглядеть так:
package main func main()
Как вы наверное заметили, красная извилистая линия под fmt говорит об ошибке. Если навести курсор на нее
то VS Code покажет в чем проблема с возможным решением.
Увидеть расширенное сообщение о проблеме можно нажав мышкой на View Problem … или Alt + F8:
Проблема в том что мы используем функцию Println() из стандартной библиотеки fmt не импортируя ее.
Так же, мы можем посмотреть возможное решение (Ctrl + J):
Кликнув на это сообщение, мы получим:
VS Codе добавил строку импорта.
Кстати об импортах библиотек в VS Code — редактор сделает это за нас при первом сохранении файла! То есть,
VS Code увидит что мы пользуем Println() из библиотеки fmt, и сам добавит import fmt.
Это касаемо синтакса, но для настоящего теста надо запустить нашу программу.
В Go это делается командой go run терминала/cmd/Powershell. Но если запустим сейчас то получим ошибку об отсутствии в папке hello_world файла go.mod —
файла зависимостей нашего кода. Открыть терминал/командную строку в VS Code это Ctrl + ` (обратная кавычка, обычно клавиша под Esc):
Исправить положение легко, командой внутри той же папки hello_world: go mod init hello:
PS C:UsersPolyglotDocumentshello_world> go mod init hello go: creating new go.mod: module hello go: to add module requirements and sums: go mod tidy
И наконец-то, запустим нашу супер прогу: go run .
Ура, бежим добавлять “опыт разработки на Go” в LinkedIn, ну почти.
Чтоб почувствовать себя настоящими программистами, научимся отлаживать код в VS Code.
Отладка программы в дебаггере Delve
В списке утилит которые мы установили в начале, был и отладчик Delve. Он самый популярный в Go, наверное потому что единственный.
Для мазохистов есть поддержка Go в GDB, конечно.
Немного изменим нашу супер-программу, добавив срез строк names как локальную переменную:
package main import «fmt» func main() < fmt.Println(«Привет, Мир! Привет, Кодбай!») names := []string// срез строк for _, i := range names < //проходим в цикле печатая каждое слово fmt.Println(i) >>
Проверим что все еще работает: go run .
Поставим останов (breakpoint) на строке 6, кликнув мышкой напротив нее слева.
И вызовем меню дебага кликом слева на тулбаре или Ctrl + Shift + D:
Затем смело жмем Run and Debug и программа запущена и остановлена на 6-ой строке как мы и хотели.
Дополнительные окна и возможности:
1 — панель контроля отладки, можно продолжить исполнения кода пошагово, до конца, перескочить блок кода, остановить отладку совсем.
2 — Locals здесь появятся все локальные переменные и их значения с обновлением по ходу исполнения кода.
3 — Watch тут мы можем установить точки наблюдения с показом их состояния на каждом шаге отладки.
4 — стек вызова функций в нашей программе.
5 — Debug Console тут выводятся сообщения программой и/или отладчиком.
6 — командная строка отладчика (Delve) где мы можем отдавать команды напрямую отладчику.
7 — список точек останова, позволяет временно отключать их, удалять, добавлять новые.
Вот так будет выглядеть отладчик после нескольких шагов:
Еще одна возможность VS Code, а точнее форматировщика/линтера, это форматирование кода согласно принятым сообществом Gopher-ов при каждом сохранении файла.
Например возьмем наш код и сделаем его страшным на лицо, и хотя работает он также, согласитесь читать такой код бррр:
Но как только мы сохраним файл Ctrl + S, встроенный форматировщик кода причешет его так:
Установка Git
Опционально но рекомендую — установить клиент Git для работы с репозиториями.
Для написания программ на Go это не требуется, формально, но практически невозможно создавать код не используя нестандартные библиотеки вообще — и 99%
таких сторонних библиотек расположены на github.com. И это значит нам понадобится клонировать их оттуда на локальную машину разработки, что без Git клиента невозможно.
Самый простой способ — скачать и в пару кликов установить Git для Windows отсюда —
Ссылка скрыта от гостей
. Альтернатива (я так пользую) — загрузить среду эмуляции Linux/Unix
для Windows Cygwin или MSYS2, и уже внутри их установить Git. На Мак-е Homebrew — brew install git.
Это все что я хотел рассказать и показать сегодня — мы установили VS Code, go (golang) утилиты и компилятор, привязали все вместе в VS Code, написали обязательный Hello, World!,
опционально установили Git, и запустили нашу прогу в отладчике. Если вам интересна тема Go и все что вокруг, пишите в комментариях о чем хотели бы почитать.
Прим: По поводу холиваров которые вы увидите в поиске по VS Code, сам основанный на GUI фреймворк Electron (JavaScript) — о том что жрет память гигабайтами, тормозит систему не по-детски,
и вообще квинтэссенция зла. Не скажу что другие видели или думают, но мой опыт говорит о другом — и память не жрет, и летает все как надо. Так или иначе, VS Code сегодня (2023) самый
популярный IDE среди профессионалов и любителей, как видно ниже из опроса StackOverflow:
Ссылка скрыта от гостей
На моей системе (Windows 10, 8 Гб памяти) VS Code выглядит так:
Дополнительные материалы
Источник: codeby.net
Как построить и запустить код C ++ в Visual Studio Code?
Это работает нормально, но когда я хочу запустить файл, я должен запустить exe из командной строки. Возможно ли сделать это в задаче? Так что, если он успешно завершит строительство, тогда он выполнит другую задачу?
Решение
Вы можете настроить несколько задач в коде Visual Studio, одна из которых позволит вам создать свой исполняемый файл, а другая будет запускать ваш исполняемый файл.
При желании вы также можете заглянуть в «Run Mode» кода Visual Studio (см. Вот ). Если вы используете «Режим запуска», вы сможете настроить код Visual Studio для сборки исполняемого файла, а затем запустить его.
Я не очень знаком с «Режимом выполнения», поэтому я подробно опишу, как определить несколько задач для достижения аналогичного результата.
Отказ от ответственности: Код Visual Studio не поддерживает задачи, которые используют различные команды оболочки (см. Вот ).
Вот так. В своем текущем состоянии код Visual Studio не имеет «встроенной» поддержки для определения задач, использующих различные команды оболочки.
Отказ от ответственности: панель вывода задач Visual Studio Code не позволит вам передавать ввод в вашу программу в интерактивном режиме.
Если ваша программа использует пользовательский ввод (например, из stdin), вам, вероятно, лучше не использовать код Visual Studio запустить свой исполняемый файл.
По сути, нам нужно определить две задачи, одна из которых будет задачей сборки, а другая — нашей задачей запуска.
Поскольку код Visual Studio не имеет большой поддержки для определения нескольких задач, каждая из которых использует различные команды оболочки, нам нужно изменить наш tasks.json «s «command» собственность на cmd (или же sh , если на Linux / macOS). Нам также нужно будет установить «args» собственность на [/C] ( [-c] если на Linux / macOS).
Причина, по которой мы это делаем, заключается в том, что мы хотим, чтобы каждая из задач, которые мы собираемся определить, передавалась в качестве аргументов новому экземпляру оболочки.
Следующий шаг — определить наши задачи по сборке и запуску. Когда мы сделаем это, нам нужно убедиться, что мы поместили команду, которую хотим запустить, в качестве аргумента задачи. Например:
< «taskName»: «build», «args»: [«gcc», «-Wall», «$», «-o», «$.exe», «-pedantic»] >
Наконец, что мы будем делать, это добавить «isBuildCommand» свойство нашей задачи сборки (и убедитесь, что это true ), а также добавить «isTestCommand» свойство нашей задачи запуска (и, опять же, убедитесь, что это true ).
После всего этого наш tasks.json файл может выглядеть примерно так:
< «version»: «0.1.0», «command»: «cmd», «args»: [«/C»], «isShellCommand»: true, «showOutput»: «always», «suppressTaskName»: true, «tasks»: [ < «taskName»: «build», «args»: [«gcc», «-Wall», «$», «-o», «$.exe», «-pedantic»], «isBuildCommand»: true >, < «taskName»: «run», «args»: [«$.exe»], «isTestCommand»: true > ] >
Заметка: Если поместить каждый аргумент задачи в свою строку внутри args массив не работает, вы также можете попробовать поместить все аргументы в одну строку внутри args массив. Пример:
[«gcc -Wall $ -o $.exe -pedantic»]
Заметка: Если вы хотите иметь возможность вызывать ваши задачи с помощью сочетаний клавиш, у вас есть «workbench.action.tasks.build» а также «workbench.action.tasks.test» Команды редактора в вашем распоряжении.
Если вам нужен пример привязки ключей к этим командам, вот пример того, как они отображаются в моем keybindings.json файл:
редактировать: Вероятно, вам нужно только определить сочетание клавиш для тестовой задачи, так как для задачи сборки, вероятно, она уже определена. Проверьте Вот прежде чем вы найдете время, чтобы определить другую комбинацию клавиш.
Другие решения
Если кто-то сталкивался с этим при поиске, как я, вы можете установить свойство preLaunchTask в вашем launch.json к вашей задаче сборки name собственности, и она будет работать до вашего запуска.
«name»: «Debug (gdb) Launch»,
«preLaunchTask»: «Build All»,
Побежит «name»: «Builld All» в вашем tasks.json перед запуском вашей программы.
Вы можете прочитать информацию об этом на Отладка в визуальном коде страница документов.
Источник: web-answers.ru