Debugging current file in VS Code

Question

I am writing javascript and am currently doing simple exercises/programs. At times, I wish to run my file for testing purposes. I am aware I could create an HTML file and do this within the console. In Sublime, there exists a way to "build" the current file and immediately see the results (say, whatever is sent to console.log).

With VS Code, it seems that for every file I want to "build"/debug in this manner, I must manually change the launch.json file to reflect the name of the current program.

I have been researching a way around this, and I learned that there are variables like ${file} , but when I use that in the launch.json "program" attribute, for example:

"program": "${workspaceRoot}/${file}"

with or without the workspaceRoot part, I get the following error:

Attribute "program" does not exist" (file name here).

Am I missing a simple way to accomplish this, or must I keep editing launch.json every time I want to run the file?

Thanks in advance!

I thinks this one has an update. Now we can just debug a js file directly by pressing the debug start button. Unless there is a config already there. It starts debugging current file automatically. — Leela Venkatesh K
– Leela Venkatesh K, Commented May 5, 2019 at 10:47

Gynteniuxas · Accepted Answer · 2016-09-18 05:12:50Z

206

Change to:

"program": "${file}"

edited Sep 18, 2016 at 5:12

Gynteniuxas

7,09918 gold badges41 silver badges59 bronze badges

answered Sep 18, 2016 at 1:50

jfriedman

2,2211 gold badge12 silver badges6 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

zubair1024 Over a year ago

I use different names to debug different files in the project and delete the entry from launch.json file once I'm done.

MuhsinFatih Over a year ago

@jdb79 You should accept the answer by clicking the green tick on the left

Razvan Pocaznoi Over a year ago

I also added on occasion "cwd": "${fileDirname}" to make it start in the current file's folder (useful for instance when loading files using a relative path to the current file's location - eg: fs.readFile('./somefile.txt'))

Martin Capodici Over a year ago

and there's more: code.visualstudio.com/docs/editor/variables-reference

riv Over a year ago

I'm doing this but whenever I press F5 it opens the current file in a new readonly editor tab.

Steve Chambers · Accepted Answer · 2022-01-17 15:24:28Z

79

For reference this is the full launch.json

{
  "launch": {
    "version": "0.2.0",
    "configurations": [
      {
        "name": "Node.js - Debug Current File",
        "type": "node",
        "request": "launch",
        "program": "${file}"
      }
    ]
  }
}

edited Jan 17, 2022 at 15:24

Steve Chambers

39.8k29 gold badges179 silver badges222 bronze badges

answered Sep 30, 2017 at 18:00

Ricardo Mayerhofer

2,33924 silver badges22 bronze badges

3 Comments

vikramvi Over a year ago

In my project's launch.json there is entry "name": "Launch Program", will it make difference instead of "Debug File" use "Launch Program" ?

Bernardo Dal Corno Over a year ago

@vikramvi no difference, it is only for reference (eg it will show in status bar the name of current active task)

Timo Over a year ago

What makes a diff is type I think: you can have similar configuration objects, but having diffs in the name and type keys. type is the language.

KyleMit · Accepted Answer · 2022-06-10 14:27:28Z

There are many different ways you may need to access a file that are provided by Predefined variables:

Supposing that you have the following requirements:

A file located at /home/your-username/your-project/folder/file.ext opened in your editor;

The directory /home/your-username/your-project opened as your root workspace.

So you will have the following values for each variable:

${userHome} - /home/your-username

${workspaceFolder} - /home/your-username/your-project

${workspaceFolderBasename} - your-project

${file} - /home/your-username/your-project/folder/file.ext

${fileWorkspaceFolder} - /home/your-username/your-project

${relativeFile} - folder/file.ext

${relativeFileDirname} - folder

${fileBasename} - file.ext

${fileBasenameNoExtension} - file

${fileDirname} - /home/your-username/your-project/folder

${fileExtname} - .ext

${lineNumber} - line number of the cursor

${selectedText} - text selected in your code editor

${execPath} - location of Code.exe

${pathSeparator} - / on macOS or linux, \ on Windows

samlandfried · Accepted Answer · 2019-02-01 04:19:07Z

1

For a single file, you can skip the launch.json file entirely. Just click the green arrow in the debugger panel and choose Node as your environment.

From here.

answered Feb 1, 2019 at 4:19

samlandfried

8219 silver badges11 bronze badges

3 Comments

Michael Currin Over a year ago

If you have no launch config setup yet, then clicking the green arrow will give you a choice of environments and then create the launch file with an item in it. Otherwise, the green arrow will run the selected item in the droplist.

Bernardo Dal Corno Over a year ago

Or just press F5

ruffin Over a year ago

Re @MichaelCurrin -- looks like a package.json with a main or bin entry may also force running the file listed there, not the active one in VS Code.

Collectives™ on Stack Overflow

Debugging current file in VS Code

4 Answers 4

5 Comments

3 Comments

Comments

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

5 Comments

3 Comments

Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related