Если вы не пишете безупречный код, отладка - один из самых важных навыков, необходимых для работы вашего кода. Когда вы пишете код, вы постоянно бормотаете себе под нос: «Почему это не работает ???» Первый шаг к ответу на свой вопрос - использование отладчика. Независимо от того, пишете ли вы новое приложение с нуля или обнаруживаете ошибки в существующем, отладка дает вам представление о том, что видит компьютер. Когда мы новички / ленивы, мы используем console.log (), чтобы выяснить, что не так. Однако console.log () довольно ограничен (выводит только ту информацию, которую вы ищете) и громоздок, потому что вам нужно вводить каждую переменную, которую вы хотите увидеть. Вместо того, чтобы вставлять console.log () каждый раз, когда вы хотите распечатать переменную, вы можете вставить «отладчик» и увидеть значения ВСЕХ переменных и функций в стеке вызовов.

Для отладки вам необходимо иметь возможность запускать приложение в браузере, потому что отладчик будет работать через Chrome.

  1. Настройте свое приложение так, чтобы оно могло работать в браузере (localhost: yourPort). На шаге 4 вы сообщите vscode, на каком порту работает ваше приложение.
  2. Вставьте ключевое слово «отладчик» в места, где вы хотите отлаживать. Отладчик остановит выполнение JavaScript в этом месте, после чего вы можете проверить значения своих переменных и стек вызовов.
  3. run = ›Начать отладку
  4. .vscode / launch.json == ›« url »:« http: // localhost: yourPort »
  5. run = ›Начать отладку
  6. Ваше приложение загрузится в Chrome. Инструменты разработчика = ›Источники =› Вкладка источников показывает, какие файлы JavaScript загружены. Если вашего файла JavaScript нет в списке, вам нужно будет перейти в место в вашем приложении (в браузере), которое активирует / загрузит ваш файл JavaScript (только вы знаете, где он будет).
  7. В vscode щелкните значок отладчика. Теперь вы можете посмотреть стек вызовов и локальные / глобальные переменные.

8. Нажмите кнопку воспроизведения, чтобы перейти к следующей точке останова отладчика.

Узел отладки

  1. Вставьте ключевое слово «отладчик» в места, где вы хотите отлаживать.
  2. Выполнить = ›Добавить конфигурации

3. Выполнить = ›Начать отладку (F5)

4. Выберите приложение узла в раскрывающемся раскрывающемся списке.

5. Обновите приложение в браузере, чтобы убедиться, что ваш javascript перезапускается до точки, которую вы хотите отлаживать.

6. Теперь вы можете просмотреть переменные и стек вызовов.

7. Чтобы перейти к следующему «отладчику», нажмите кнопку воспроизведения.