Adarsh Konchady
Adarsh Konchady's Blog

Adarsh Konchady's Blog

Debugging standalone JS files in VSCode

Debugging standalone JS files in VSCode

Adarsh Konchady's photo
Adarsh Konchady
·Aug 24, 2021·

1 min read

Subscribe to my newsletter and never miss my upcoming articles

You have most likely used VSCode if you have been doing web development for some time. I switch between WebStorm and VSCode for my company’s projects but I have started to prefer VSCode more since it has a much faster boot time.

Recently, I ran into an issue when I just wanted to test a simple script file and wanted to debug it as I wrote it. I could of course use the Chrome debugger but this needed some more work 🤷‍♂

Anyways, I didn’t want to do this over and over again and wanted to set this up in a way that it works across projects on my system.

Here is how I did it:

  • Press Cmd + , (or Ctrl + , for Windows) to get into the Settings page

  • Search for Global debug launch configuration

  • Click on Edit in settings.json

  • Add the following configuration under launch
"launch": {
    "inputs": [],
    "configurations": [
      {
          "type": "node",
          "request": "launch",
          "name": "Launch Current Opened File",
          "program": "${file}"
      }
    ],
    "compounds": []
  }

And you’re all set !

Go back to your JS file and hit F5 . Any breakpoints will let you debug variables from here on.

Enjoy debugging 👋

 
Share this