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?

回答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.

回答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.

回答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"
  ]
}

回答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.

回答5:

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

var results = async function();

and check the value in results