Супер простой способ отлаживать Node.js с VS-кодом

Node.js задняя часть Debug Программа перевода самородков Visual Studio Code

Посмотрим правде в глаза... Отладка Node.js всегда была болью в наших сердцах.

Достижение болевых точек отладки Node.js

Если вам когда-либо доводилось писать код для проекта Node.js, вы понимаете, о чем я говорю, когда говорю, что отладка и поиск того, что идет не так, — не самая простая задача.

В отличие от JavaScript в браузере или Java с мощной IDE, такой как IntelliJ, вы не можете везде устанавливать точки останова, обновлять страницу или перезапускать компилятор, и вы не можете медленно просматривать код, проверять объекты, оценивать функции, находить мутации или отсутствовать. переменные и т.д. Ты не можешь этого сделать, это очень плохо.

Но Node.js тоже можно отлаживать, просто для этого требуется немного больше усилий. Давайте серьезно обсудим эти варианты, и я покажу вам самый простой метод отладки, с которым я столкнулся в своем опыте разработки.

Некоторые дополнительные способы отладки Node.js

Существует несколько способов отладки проблемных программ Node.js. Я перечислил эти методы (с подробными ссылками) ниже. Если вы заинтересованы, вы можете пойти, чтобы узнать.

  • Console.log()— Если вы когда-либо писали код на JavaScript, этот надежный запасной вариант действительно не нуждается в дополнительных пояснениях. Он встроен в Node.js и печатается в терминале точно так же, как встроен в JavaScript и печатается в консоли браузера.

В языке Java этоSystem.out.println(). В языке Python этоprint(). Вы видите, что я имею в виду. Это самый простой способ реализации и самый быстрый способ «загрязнить» чистый код дополнительными строками информации, но он также может (иногда) помочь вам найти и исправить ошибки.

  • Документация Node.js—-inspect— Сами составители документации Node.js понимали, что отладка — это непросто, поэтому ониудобный справочникПомогите людям начать отладку.

Это полезно, но, честно говоря, это не так просто расшифровать, если вы не занимаетесь программированием какое-то время. Они быстро попали в ловушку UUID, WebSockets и последствий для безопасности, и я начал чувствовать себя подавленным. Я подумал про себя: должен быть менее сложный способ сделать это.

  • Chrome DevTools—Paul IrishВ 2016 году написал статью об отладке Node.js с помощью Chrome DevTools.Сообщение блога(и обновлено в 2018 году). Это выглядит довольно просто и является отличным улучшением для отладки.

Спустя полчаса я так и не смог успешно подключить окно DevTools к моей простой программе Node, и я больше не уверен. Может быть, я просто не могу следовать инструкциям, но Chrome DevTools, кажется, делает отладку более сложной, чем должна быть.

  • JetBrains— JetBrains — одна из моих любимых компаний по разработке программного обеспечения и один из разработчиков IntelliJ и WebStorm. Их инструменты имеют фантастическую экосистему плагинов, и до недавнего времени они были моей предпочтительной IDE.

С такой профессиональной пользовательской базой многие полезные статьи, такие какВот этот, они отлаживают Node, но, как и в случае с документацией Node и опциями Chrome DevTools, это непросто. Вам нужно создать конфигурации отладки, подключить запущенные процессы и выполнить множество настроек в настройках, прежде чем WebStorm будет готов.

  • Visual Studio Code— Это мой новый золотой стандарт отладки узлов. Я никогда не думал, что скажу это, но я полностью вVS Code, и каждый выпуск новой функции, которую команда делает, заставляет меня любить эту IDE еще больше.

VS Code делает все остальные параметры вОтладка Node.jsТо, что никто из них не может сделать, что делает это глупо легким. Если вы хотите сделать свою отладку более продвинутой, это, безусловно, возможно, но они разбивают ее достаточно просто, чтобы любой мог быстро приступить к работе, независимо от вашей IDE, Node и навыков программирования. Это круто.

Настройте VS Code для отладки Node.js

Хорошо, давайте настроим VS Code для отладки Node. я предполагаю, что у вас естьздесьЗагрузите VS Code и начните его настройку.

ОткрытымPreferences > Settings, введите в поле поискаnode debug. существуетExtensionsПод вкладками должен бытьNode debugрасширение. Нажмите на первое поле здесь:Debug > Node: Auto Attach, а затем установите параметры раскрывающегося списка наon. Вы почти закончили настройку. Да, это довольно просто.

这是当你点击 Settings 选项卡，你应该能看到的内容。设置第一个下拉框 **Debug > Node: Auto Attach** 选项为 `on`。

Теперь перейдите в файл проекта и установите несколько точек останова, где вы хотите увидеть паузу кода, щелкнув левую боковую панель файла. Введите в терминалеnode --inspect <FILE NAME>. Смотри, случилось что-то волшебное...

看到红色断点了吗？看到终端中的 `node — inspect readFileStream.js` 了吗？就像这样。

Выполняется отладка кода в VS Code

Если вам нужен проект Node.js для его тестирования, вы можетеэто здесьЗагрузите мой репозиторий. Он используется для тестирования различных форм передачи больших объемов данных с помощью Node, но в этой демонстрации он отлично работает. Если вы хотите узнать больше об узлах потоковой передачи данных и оптимизации производительности, вы можете нажатьздесьиздесь.

когда вы нажимаетеEnterключ, нижняя часть вашего терминала VS Code станет оранжевой, указывая на то, что вы находитесь в режиме отладки, и ваша консоль напечатает что-то вродеDebugger AttachedИнформация.

橙色的工具栏和 `Debugger attached` 消息会告诉你 VS Code 正常运行在调试模式。

Когда вы видите, что это происходит, поздравляю, Node.js работает в режиме отладки!

На этом этапе вы можете видеть точки останова, которые вы установили, в левом нижнем углу экрана (и вы можете переключать включенный статус этих точек останова с помощью флажка), и вы можете выполнять отладку, как в браузере. В верхней центральной части IDE есть маленькие кнопки «Продолжить», «Выйти», «Войти», «Повторить» и т. д. для пошагового выполнения кода. VS Code даже выделяет точки останова и строки, на которых вы остановились, желтым цветом, что упрощает отслеживание.

单击顶部的继续按钮，从一个断点跳转到代码中的下一个断点。

Когда вы переключаетесь с одной точки останова на другую, вы можете увидеть, как программа распечатывает кучу в консоли отладки в нижней части кода VS.console.log, желтая подсветка перемещается вместе с ним.

如你所见，当我们暂停在断点上时，我们可以在 VS Code 的左上角看到可以在控制台中探索到的所有局部作用域信息。

Как видите, по мере выполнения программы, чем больше выводит консоль отладки, тем больше точек останова, и в процессе я могу исследовать объекты и функции в локальной области видимости с помощью инструментов в верхнем левом углу VS Code, как я могу исследовать области и объекты в браузере. хорошо!

Это просто, верно?

Суммировать

Отладка Node.js не должна быть такой громоздкой, как раньше, и вам не нужно включать более 500 кодов в вашу кодовую базу.console.logчтобы найти местонахождение ошибки.

Код Visual StudioDebug > Node: Auto AttachУстановка делает это делом прошлого, и я очень благодарен за это.

Через несколько недель я напишу о сквозном тестировании, использовании Puppeteer и безголового Chrome или об использовании Nodemailer для сброса паролей в приложениях MERN, так что следите за мной, чтобы не пропустить.

Спасибо за прочтение, надеюсь, эта статья дала вам представление о том, как проще и эффективнее отлаживать программы Node.js с помощью VS Code. Большое спасибо за аплодисменты и за то, что поделились моей статьей!

Если вам понравилось читать эту статью, возможно, вам понравятся и другие мои статьи:

Ссылки и дополнительные ресурсы:

Если вы обнаружите ошибки в переводе или в других областях, требующих доработки, добро пожаловать наПрограмма перевода самородковВы также можете получить соответствующие бонусные баллы за доработку перевода и PR. начало статьиПостоянная ссылка на эту статьюЭто ссылка MarkDown этой статьи на GitHub.

Программа перевода самородковэто сообщество, которое переводит высококачественные технические статьи из Интернета сНаггетсДелитесь статьями на английском языке на . Охват контентаAndroid,iOS,внешний интерфейс,задняя часть,блокчейн,продукт,дизайн,искусственный интеллекти другие поля, если вы хотите видеть больше качественных переводов, пожалуйста, продолжайте обращать вниманиеПрограмма перевода самородков,официальный Вейбо,Знай колонку.

Категории