Welcome to the second article about debugging if you're struggling with debugging, you're in the right place 😉
📚 Minute of theory.
There are 2 basic types of debugging:
- Attach (means you're attaching to an already running process)
- Launch - means you're launching a new process and attaching to it. It can be a headless chrome or anything else)
After some basic understanding, let's jump to the actual configuration.
1) Add a configuration object inside your array of configurations in .vscode/launch.json
in the project's root.
{
"configurations": [
{
"name": "Launch Chrome",
"request": "launch",
"type": "chrome",
"url": "http://localhost:8080", // localhost where we will launch our front-end
"webRoot": "${workspaceFolder}"
},
]
}
💡 Tip: You can generate the same code by pressing the "Add configuration" button in VSCode bottom right corner.
After clicking the button, you will see a context menu where you should choose Chrome launch.
And here we go! You will get the same config as in step #1 😎
2) After that, choose in the left top corner your option to launch the configuration inside the Run and debug menu
in VSCode
3) As a result, you will see the lifted application on a specified port!
See you in the following article about controllers in a VSCode debugger 🥳
Top comments (0)