Итак, если вы все еще используете отладчик Chrome, то вам хорошо, что вы уже опережаете большинство Front-end разработчиков, которые сталкиваются с каждой проблемой с журналами консоли. Но если вы когда-либо думали, что вам все еще не хватает чего-то, что могло бы устранить ваш дискомфорт при использовании отладчиков и улучшить общее впечатление от отладки приложений, вы могли быть правы и должны были быть в том месте, где вам нужно быть, чтобы это исправить. Да, я говорю об отладке в удобной среде IDE, с элегантным, правильно выделенным кодом и с ярлыками!
Давайте посмотрим на это в действии. На первом этапе вам будет предоставлен небольшой код, который поможет вам отладить текущий открытый файл в редакторе.
Просто скопируйте и вставьте следующий фрагмент в .vscode / launch.json.
{
"version": "0.2.0",
"configurations": [{
"type": "pwa-node",
"request": "launch",
"name": "Node Debugger",
"program": "${file}"
}];
}
Теперь переключите отладчик внутри вашего файла (вы можете использовать мою суть) и запустите отладчик (Command / Control + Shift + D), затем нажмите зеленый значок воспроизведения (▷), вы запустите отладчик VScode. Я должен выглядеть так, как показано ниже.
Теперь вам нужно редактировать конкретный файл, для этого вы можете объявить его в соответствии с путем в «программе». Измененный файл должен выглядеть так.
{
"version": "0.2.0",
"configurations": [
{
"type": "pwa-node",
"request": "launch",
"name": "Node Debugger",
"program": "${workspaceFolder}\\app.js"
}
]
}
Чтобы обогатить опыт, я лично рекомендую прикрепить клавишу «переключить отладчик» к некоторому удобному сочетанию клавиш, для меня это «command + d», и я использую «command + kd» для удаления всех отладчиков.
А для пользователей MacOS все 6 команд отладчика отображаются в левой части сенсорной панели, избавляя от необходимости прикреплять ярлыки. Мне лично они очень нравятся, и я использую их постоянно.
Вот и все, пожалуйста, хлопайте в ладоши, если вы нашли эту статью полезной.
