Создание приложения Node.js в Visual Studio Code
В этом уроке вы узнаете, как:
- Создайте приложение JavaScript с помощью Visual Studio Code и Cosmos DB.
- Используйте intellisense, чтобы помочь в написании кода.
- Запустите приложение с помощью Node.js из Visual Studio Code.
- Используйте интегрированный отладчик для пошагового выполнения кода и проверки переменных при выполнении кода.
Создание приложения JavaScript для Node.js
Приложение JavaScript для Node.js можно создать из Visual Studio Code с помощью окна терминала. Команда npm init -y создает файл с именем package.json в папке приложения. Этот файл содержит метаданные, используемые для описания приложения для среды выполнения Node.js.
Затем необходимо создать новый файл для кода приложения. При сохранении файла убедитесь, что вы предоставите файл расширению JS (для JavaScript). Теперь вы готовы приступить к написанию кода JavaScript.
Использование IntelliSense при написании кода
В процессе написания кода IntelliSense может выполнять проверку типов и завершение кода. Например, при создании функций, определении типов или даже импорте модуля в файл JavaScript добавленные или импортированные элементы становятся доступными для IntelliSense.
Когда вы вводите текст, IntelliSense использует проверку и определение типов для вывода предложений, соответствующих текущему контексту. Определение типа позволяет IntelliSense предлагать допустимые варианты завершения кода.
Проверка типа позволяет IntelliSense отображать параметры, которые может принимать вызов функции, и проверять типы в выражениях, которые вы вводите для каждой функции:
Помимо этого, в Visual Studio Code доступны и другие функции IntelliSense.
- Обнаружение недостижимого кода и неиспользуемых переменных. Операторы, которые не могут быть выполнены, и переменные, которые никогда не используются, отображаются в редакторе серым цветом.
- Просмотр определений и ссылок. Средство обзора позволяет быстро просмотреть определение объекта или функции, даже если оно находится в другом файле. Щелкните переменную или функцию правой кнопкой мыши и выберите Показать определение или Показать ссылки. Определение или ссылки отображаются во всплывающем окне.
- Переход к определению переменной, функции или типа. Эта функция позволяет напрямую перейти к определению переменной, функции или типа в коде. Это полезно, если необходимо изменить определение элемента или функцию. Щелкните правой кнопкой мыши код со ссылкой на переменную или тип либо с вызовом функции. Выберите команду Перейти к определению или Перейти к определению типа.
- Предложение возможного рефакторинга кода. Многоточие (...) под элементом обозначает области, для которых IntelliSense имеет одно или несколько предложений. Выберите многоточие, чтобы просмотреть предложения. Выберите Быстрое исправление, чтобы применить предложение.
Запуск и отладка приложения Node.js
Самый простой способ запустить приложение Node.js из Visual Studio Code — использовать команду node в окне терминала. Например, чтобы запустить код в файле с именем index.js, выполните команду node index.js.
Из окна терминала можно использовать собственный отладчик Node.js (например, node inspect index), но Visual Studio Code предоставляет расширенную среду для пошагового выполнения и отладки приложений Node.js.
Настройка отладчика в файле launch.json
Прежде чем использовать отладчик Visual Studio Code, его необходимо настроить. Чтобы изменить параметры конфигурации отладчика, в меню "Выполнить " выберите пункт "Добавить конфигурацию". В параметре "Выбор отладчика" выберите Node.js. Файл ./.vscode/launch.json отображает новую конфигурацию.
{
// Use IntelliSense to learn about possible attributes.
// Hover to view descriptions of existing attributes.
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
"version": "0.2.0",
"configurations": [
{
"type": "node",
"request": "launch",
"name": "Launch Program",
"skipFiles": [
"<node_internals>/**"
],
"program": "${workspaceFolder}/index.js",
}
]
}
Для этого приложения Contoso с несколькими файлами кода для запуска мы добавим несколько дополнительных свойств. Измените имя ${file}файла свойств программы на . Это позволяет отлаживать текущий активный файл JavaScript. Добавьте свойство args, когда необходимо передать параметры приложению. Эти значения доступны из свойства process.argv , доступного в среде выполнения Node.js.
{
// Use IntelliSense to learn about possible attributes.
// Hover to view descriptions of existing attributes.
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
"version": "0.2.0",
"configurations": [
{
"type": "node",
"request": "launch",
"name": "Launch Program",
"skipFiles": [
"<node_internals>/**"
],
// ${file} is replaced with active file's name
"program": "${workspaceFolder}/${file}",
// these values are available as process.argv
"args": ["abc", "1"],
}
]
}
Задание точек останова
Перед началом отладки необходимо задать точку останова в коде приложения. Для этого щелкните в левом поле рядом с оператором, на котором необходимо приостановить выполнение. Появится красная точка.
Запуск отладки
Чтобы начать отладку, выберите "Начать отладку " в меню "Запуск " или запустите отладчик F5. Если используется внешний терминал, появится новое окно терминала. Выходные данные отладчика будут отображаться в окне вывода в Visual Studio Code.
Когда отладчик достигает точки останова в приложении, выполнение приостанавливается и выделена инструкция точки останова. Windows в обозревателе запуска и отладки позволяет проверять и задавать значения локальных и глобальных переменных, а также стек вызовов. Кроме того, можно добавлять выражения Контрольное значение, которые вычисляются и отображаются по мере выполнения.
| Элемент | Description |
|---|---|
| 1 — переменные | Все переменные в локальной и глобальной область. |
| 2- Смотреть | Добавьте все переменные для просмотра во время выполнения. |
| 3. Стек вызовов | Стек выполнения приложения в текущий момент времени. |
| 4. Точки останова | Все точки останова, заданные в приложении. |
| 5. Панель инструментов отладки | Она содержит команды, позволяющие выполнять код пошагово. Если оператор содержит вызов функции, можно выполнить шаг с заходом в нее или шаг с обходом. Если выбрать команду "Шаг с выходом", выполнение будет продолжаться до тех пор, пока функция не завершится. Вы также можете продолжить выполнение приложения, пока отладчик не достигнет другой точки останова или приложение не завершит работу. |
| 6. Консоль отладки | Ознакомьтесь со значениями инструкций консоли. |
При добавлении кода JavaScript в следующих нескольких упражнениях может потребоваться выполнить отладку кода, чтобы определить, что не так. Вернитесь к этому уроку при необходимости.