Visual Studio Code not showing console logs

Question

For example, in this method, I use console.log() to log to console for debugging purposes

_onSearchTextChanged = (event) => {
    console.log('_onSearchTextChanged');
    ...
};

But Visual Studio Code does not show anyting in console

Answer 1

If you are using the debug mode in visual studio code, you can add the option:

{
 "outputCapture": "std"
}

That will redirect your logs inside the debug console.

EDIT : as mentioned by Luigi04 in the comment section, this setting need to be put inside the launch.json

Answer 2

Inside launch.json (open it using F1), under configurations, add the outputCapture property (if not already exists) with either std or console, as follows :

{
  ...
  "configurations": [
    {
      ...
      "outputCapture": "std", // or "console" 
    }
  ]
}

as for "std", this is what the documentation has to say:

outputCapture - if set to std, output from the process stdout/stderr will be shown in the Debug Console, instead of listening to output over the debug port. This is useful for programs or log libraries that write directly to the stdout/stderr streams instead of using console.* APIs.

Also note that using std will show you full errors (as for VSCode 1.49.0). For example, create a js file containing an error:

console.log(a) // error: a is undefined

Using std:

c: \Users\path\to\file.js: 1
console.log(a) // error: a is undefined
    ^

ReferenceError: a is not defined
at Object.<anonymous>(c: \Users\path\to\file.js: 1: 13)
at Module._compile(internal / modules / cjs / loader.js: 1158: 30)
at Object.Module._extensions..js(internal / modules / cjs / loader.js: 1178: 10)
at Module.load(internal / modules / cjs / loader.js: 1002: 32)
at Function.Module._load(internal / modules / cjs / loader.js: 901: 14)
at Function.executeUserEntryPoint[as runMain](internal / modules / run_main.js: 74: 12)
at internal / main / run_main_module.js: 18: 47

Using console:

Uncaught ReferenceError: a is not defined

so in my opinion, std is somewhat better.

Answer 3

If you are running & testing your code in the browser the press 'F12' (for google chrome) to see the logs in the browser. If you are running in the debug mode, In Visual Studio Code then only logs will be displayed.In the menu bar there is Debug option to run in debug mode or u can find complete reference here