How To Debug Async/await In Visual Studio Code?

I want to debug js file that includes async/await in visual studio code,but it reminds me that vscode doesn't support it. What can I do to make vscode support async/await?

Solution 1:

As now, in 2019, latest VSCode supporting async/await debug, just would like to share solution to prevent vscode to "Step into" (by f11) into async/await method through the "async_hooks.js" and "inspector_async_hook.js" files during debug nodejs applications.

Howto :

1) press ctrl+p in vscode and type ">launch", select "open launch.json"

2) after opening "launch.json", just add to configuration section :

"skipFiles":["inspector_async_hook.js","async_hooks.js"]

or some more generic version :

"skipFiles":["<node_internals>/**"]

So you final json should looks something like here:

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Launch Program",
      "program": "${workspaceFolder}\\index.js",
      "skipFiles": ["<node_internals>/**"]
    }
  ]
}

After these steps you can see your real async method after pressing F11 in debug mode.

Solution 2:

Currently you can use async/await in Node.js 7 or latest using --harmony flag, you can configure your vscode debugger (launch.json) in the following way to run and debug async/await Nodejs code.

{
    "version": "0.2.0",
    "configurations": [
        {
            "type": "node",
            "request": "launch",
            "name": "Node 7 Async/Await",
            "program": "${workspaceRoot}/main.js",
            "cwd": "${workspaceRoot}",
            "runtimeArgs": [
                "--harmony",
                "--no-deprecation"
            ]
        },
        {
            "type": "node",
            "request": "attach",
            "name": "Attach to Process",
            "port": 5858
        }
    ]
}

You must change the program by your startup script file.

Solution 3:

I had major performance issues with VS Code debugging a Node project with TypeScript was unusable, so I found that changing the protocol=='inspector' and targeting es2017 allowed a fast and reliable debugging experience. Here is the config I used...

launch.json

{
    "version": "0.2.0",
    "configurations": [
        {
            "type": "node",
            "request": "launch",
            "name": "Launch Program",
            "program": "${workspaceRoot}/lib/main.js",
            "protocol": "inspector",
            "runtimeArgs": [
                "--harmony",
                "--no-deprecation"
            ],
            "outFiles": [
                "${workspaceRoot}/lib/**/*.js"
            ],
             "skipFiles": [
                "${workspaceRoot}/node_modules/**/*.js"
            ],
            "smartStep": true
        }
    ]
}

tsconfig.json

{"compilerOptions":{"target":"es2017","module":"commonjs","declaration":true,"sourceMap":true,"outDir":"lib","lib":["dom","es2017"],"suppressImplicitAnyIndexErrors":true,"allowSyntheticDefaultImports":true},"compileOnSave":true,"exclude":["node_modules"],"include":["src"]}

Solution 4:

You can use the Node.js --inspect option to debug your code in Chrome. Just like this:

# node --inspect app/app.js

And open the Chrome: chrome://inspect. That's so cool. You can specify in this doc.

Solution 5:

until we have VSCode's support on that subject, you can try putting your results into a var like this:

var results = asyncfunction();

and check the value in results