February 28, 2020

Debugging web applications in vscode

Add this config in .vscode/launch.json

  "version": "0.2.0",
  "configurations": [
      "type": "chrome",
      "request": "launch",
      "name": "Launch Chrome against localhost",
      "url": "http://localhost:3000",
      "webRoot": "${workspaceFolder}"

This config is assuming that your web application is running at localhost:3000. This vscode launch config starts a new chrome process with remote debugging enabled. Now you can control the debug process through the vscode debugger interface.

Also make sure that source-maps are enabled for your dev server.

vscode javascript chrome

Previous post
Understanding Solid: JSX
Next post
Typescript function parameter Types