Если вы не пишете безупречный код, отладка - один из самых важных навыков, необходимых для работы вашего кода. Когда вы пишете код, вы постоянно бормотаете себе под нос: «Почему это не работает ???» Первый шаг к ответу на свой вопрос - использование отладчика. Независимо от того, пишете ли вы новое приложение с нуля или обнаруживаете ошибки в существующем, отладка дает вам представление о том, что видит компьютер. Когда мы новички / ленивы, мы используем console.log (), чтобы выяснить, что не так. Однако console.log () довольно ограничен (выводит только ту информацию, которую вы ищете) и громоздок, потому что вам нужно вводить каждую переменную, которую вы хотите увидеть. Вместо того, чтобы вставлять console.log () каждый раз, когда вы хотите распечатать переменную, вы можете вставить «отладчик» и увидеть значения ВСЕХ переменных и функций в стеке вызовов.
Для отладки вам необходимо иметь возможность запускать приложение в браузере, потому что отладчик будет работать через Chrome.
- Настройте свое приложение так, чтобы оно могло работать в браузере (localhost: yourPort). На шаге 4 вы сообщите vscode, на каком порту работает ваше приложение.
- Вставьте ключевое слово «отладчик» в места, где вы хотите отлаживать. Отладчик остановит выполнение JavaScript в этом месте, после чего вы можете проверить значения своих переменных и стек вызовов.
- run = ›Начать отладку
- .vscode / launch.json == ›« url »:« http: // localhost: yourPort »
- run = ›Начать отладку
- Ваше приложение загрузится в Chrome. Инструменты разработчика = ›Источники =› Вкладка источников показывает, какие файлы JavaScript загружены. Если вашего файла JavaScript нет в списке, вам нужно будет перейти в место в вашем приложении (в браузере), которое активирует / загрузит ваш файл JavaScript (только вы знаете, где он будет).
- В vscode щелкните значок отладчика. Теперь вы можете посмотреть стек вызовов и локальные / глобальные переменные.
8. Нажмите кнопку воспроизведения, чтобы перейти к следующей точке останова отладчика.
Узел отладки
- Вставьте ключевое слово «отладчик» в места, где вы хотите отлаживать.
- Выполнить = ›Добавить конфигурации
3. Выполнить = ›Начать отладку (F5)
4. Выберите приложение узла в раскрывающемся раскрывающемся списке.
5. Обновите приложение в браузере, чтобы убедиться, что ваш javascript перезапускается до точки, которую вы хотите отлаживать.
6. Теперь вы можете просмотреть переменные и стек вызовов.
7. Чтобы перейти к следующему «отладчику», нажмите кнопку воспроизведения.