Debugging multiple Node js Function apps in VS Code - azure

I am currently developing a couple of node js function apps in the same project that I would like to be able to debug together. After some effort I was able to run them without a debugger with compounds. And it kinda works since all functions are running although im only able to see output from one at a time.
launch.json
{
"version": "0.2.0",
"configurations": [
{
"name": "Func1",
"type": "node",
"request": "launch",
"port": 9000,
"preLaunchTask": "npm: start - func1"
},
{
"name": "Func2",
"type": "node",
"request": "launch",
"port": 9001,
"preLaunchTask": "npm: start - func2"
}
],
"compounds": [
{
"name": "Compound",
"configurations": [
"Func1",
"Func2"
]
}
]
}
tasks.json
{
"version": "2.0.0",
"tasks": [
{
"type": "npm",
"script": "start",
"path": "func1/",
"problemMatcher": [],
"label": "npm: start - func1",
"detail": "func start"
},
{
"type": "npm",
"script": "start",
"path": "func2/",
"problemMatcher": [],
"label": "npm: start - func2",
"detail": "func start"
}
]
}
I have also tried different configurations in tasks.json and launch.json using func start with moderate success and I have been able to attach a single function app to debugger while starting the rest.
"type": "func",
"label": "func: start - func1"
"command": "host start",
"problemMatcher": "$func-node-watch",
"isBackground": true,
"dependsOn": "npm: install - func1",
"options": {
"cwd": "${workspaceFolder}/func1"
}
But when I attempt to add a second one with another label it is only able to recognize one of them and the launch of the other app receives error "Could not find the task 'func: start - func2'".
My questions are if it is possible to have multiple Function App attached to debugger and in that case how? Would it also be possible to get the logs in the same output terminal or multiple terminals for each Function App. I know that both can be achived in Visual Studio with c# but is it possible in VS Code with Node.

I am currently developing a couple of node js function apps in the
same project
1, If your function app here refers to Trigger, then the default settings of VS Code should be able to be achieved (unprocessed functions will be in a waiting state, but every place marked with a breakpoint will be executed, but you cannot be in different at the same time Breakpoints).
2, If your function app here refers to a standalone app, then the key is the port. Below settings can change the default port of function app on local:
{
"IsEncrypted": false,
"Values": {
"AzureWebJobsStorage": "",
"FUNCTIONS_WORKER_RUNTIME": "python"
},
"Host": {
"LocalHttpPort": 5861,
"CORS": "*",
"CORSCredentials": false
}
}
After the above settings, you can start two VS Code programs Debug different function app at the same time without causing conflicts.

Related

Can't start debugging node

This is my first time use debugger on Visual Studio Code. I am working on a asp.net-react webapi. I was easily able to use debugger for .net Core. Here is my launch.json:
{
"version": "0.2.0",
"configurations": [
{
// Use IntelliSense to find out which attributes exist for C# debugging
// Use hover for the description of the existing attributes
// For further information visit https://github.com/OmniSharp/omnisharp-vscode/blob/master/debugger-launchjson.md
"name": ".NET Core Launch (web)",
"type": "coreclr",
"request": "launch",
"preLaunchTask": "build",
// If you have changed target frameworks, make sure to update the program path.
"program": "${workspaceFolder}/API/bin/Debug/net6.0/API.dll",
"args": [],
"cwd": "${workspaceFolder}/API",
"stopAtEntry": false,
// Enable launching a web browser when ASP.NET Core starts. For more information: https://aka.ms/VSCode-CS-LaunchJson-WebBrowser
"serverReadyAction": {
"action": "openExternally",
"pattern": "\bNow listening on:\s+(https?://\S+)"
},
"env": {
"ASPNETCORE_ENVIRONMENT": "Development"
},
"sourceFileMap": {
"/Views": "${workspaceFolder}/Views"
}
},
{
"name": ".NET Core Attach",
"type": "coreclr",
"request": "attach"
}
]
}
Then I wanted to use debugger for node. I watched some videos from youtube but none of them worked. I also followed this link https://code.visualstudio.com/docs/editor/debugging, followed his steps but I nothing worked. I tried on launch, on attach, but the debugger doesn't even start. I added a onlaunch configuration:
{
"name": "Launch Program",
"program": "${workspaceFolder}/app.js",
"request": "launch",
"skipFiles": [ "<node_internals>/**" ],
"type": "node"
},
and it threw me this error on debug console:
C:\Program Files\nodejs\node.exe .\app.js
Process exited with code 1 Uncaught Error
Error: Cannot find module
'c:\Users\Lenovo\Desktop\Student\app.js' at
Module._resolveFilename (internal/modules/cjs/loader:933:15) at
Module._load (internal/modules/cjs/loader:778:27) at
executeUserEntryPoint (internal/modules/run_main:77:12) at
(internal/main/run_main_module:17:47)
No debugger available, can not send 'variables'
When I use onattach configuration:
{
"name": "Attach",
"port": 3000,
"request": "attach",
"skipFiles": [ "<node_internals>/**" ],
"type": "node"
},
it doesn't even throw any error, nor start debugging.
I googled and tried so many ways and nothing worked. Can anybody explain what should I do.
Thank you.

Visual studio Code Debugger Not Working Fine For My Nodejs App

I am trying to use the vs code debugger for my node.js application and all the commands and code but when i apply the break point it goes back to the main files and function of the nodejs and npm files instead of going back step by step to the service and then storage, brake points not working properly for my apis any body can help
{
// Use IntelliSense to learn about possible attributes.
// Hover to view descriptions of existing attributes.
// For more information, visit: https://go.microsoft.com/fwlink/?
linkid=830387
"version": "0.2.0",
"configurations": [
{
"type": "node",
"request": "attach",
"name": "Attach by Process ID",
"processId": "${command:PickProcess}"
},
{
"type": "node",
"request": "launch",
"name": "Launch Program",
"program": "${workspaceFolder}/app/app.js"
},
{
"type": "node",
"request": "launch",
"name": "Launch via NPM",
"runtimeExecutable": "npm",
"runtimeArgs": [
"run-script",
"debug"
],
"port": 9229
},
{
"type": "node",
"request": "launch",
"name": "My Debugger",
"program": "${workspaceFolder}\\index.js"
}
]
}
Have you tried attaching to a node process?
Step 1: Run the code.
Step 2: Press CMD + SHIFT + P then search for "Attach to Node Process" and it will list the running processes.
Step 3: Choose the process you want to attach to.
This enables debugging.

Start up Docker container in VS Code when remote debug by pressing F5

I want to remote debug a docker container and spin it up when pressing the F5 (debug). It works just fine expept for that one particular problem. The container is started but the shell does not quit and hence nothing happens. Python source code is just to check whether it works:
import ptvsd
import time
import os
print("Waiting to attach")
address = ('0.0.0.0', 3000)
ptvsd.enable_attach(address)
ptvsd.wait_for_attach()
time.sleep(2)
print('something changed')
print("end")
I've tried to run it with the preLaunchTask of launch.json:
{
// Use IntelliSense to learn about possible attributes.
// Hover to view descriptions of existing attributes.
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
"version": "0.2.0",
"configurations": [
{
"name": "Python: Terminal (integrated)",
"type": "python",
"request": "launch",
"program": "${file}",
"console": "integratedTerminal"
},
{
"name": "DOCKER (Remote Debug)",
"type": "python",
"request": "attach",
"port": 3000,
"host": "localhost",
"pathMappings": [
{"localRoot": "${workspaceFolder}", "remoteRoot": "/app/"}
],
"preLaunchTask": "start_docker_compose",
"redirectOutput": false
}
]
}
Additinionally, I've created a task.json to run the container:
{
// See https://go.microsoft.com/fwlink/?LinkId=733558
// for the documentation about the tasks.json format
"version": "2.0.0",
"tasks": [
{
"label": "start_docker_compose",
"type": "shell",
"command": [
"docker run -it -p 5000:5000 dockertest",
],
"problemMatcher": []
}
]
}
It works just fine until the shell command starts up the container and the string "Waiting to attach" shows up. Then nothing happens because the shell waits and therefore the remote debugging process can't connect either. Is there a workaround (I've tried a bash as well with the same result) or am I wrong and there is a much smoother solution.
Would be great if someone could point me in the right direction.

Typescript build task in VSCode on Windows 10 with Windows Subsystem for Linux

My VSCode settings (workspace settings in my case) are setup to use bash as the default terminal:
{
"terminal.integrated.shell.windows": "C:\\WINDOWS\\Sysnative\\bash.exe"
}
I need this to be able to debug my app.
My tasks.json looks like that:
{
"version": "2.0.0",
"tasks": [
{
"type": "typescript",
"tsconfig": "./tsconfig.json",
"group": {
"kind": "build",
"isDefault": true
}
}
]
}
So when I try to build my project / run the build task (i.e. Ctrl + B), I get the following error:
> Executing task: tsc -p "c:\PATH_TO_MY_PROJECT\tsconfig.json" <
error TS5058: The specified path does not exist: 'c:\PATH_TO_MY_PROJECT\tsconfig.json'.
The terminal process terminated with exit code: 1
If I disable bash in my settings an use the default Windows terminal, the build works fine.
I remember it working few VSCode updates ago, but it stopped working in the latest VSCode versions. Not sure how that's related.
I tried to fix this for a while, but finally gave up on the built-in Typescript task and instead just used a custom task:
{
// See https://go.microsoft.com/fwlink/?LinkId=733558
// for the documentation about the tasks.json format
"version": "2.0.0",
"tasks": [
{
"label": "Typescript watch",
"type": "shell",
"command": "tsc --watch",
"group": {
"kind": "build",
"isDefault": true
},
"presentation": {
"reveal": "always",
"panel": "new"
},
"problemMatcher": [
"$tsc"
]
}
]
}

Using "preLaunchTasks" and Naming a Task in Visual Studio Code

According to the documentation, it is possible to launch a program before debugging:
To launch a task before the start of each debug session, set the preLaunchTask to the name of one of the tasks specified in tasks.json.
I've not seen example syntax of a "named" task, but the schema documentation reveals a property called taskName. I tried using that to link my launch.json preLaunchTasks to the task, but it didn't work. When I launched my program, Visual Studio Code reported this error:
Could not find a unique task 'launch-core'. Make sure the task exists and that it has a unique name.
My custom "named" task looked something like this:
{
"taskName": "launch-core",
"version": "0.1.0",
"command": "C:\\utils\\mystuff.exe",
// The command is a shell script
"isShellCommand": true,
// Show the output window only if unrecognized errors occur.
"showOutput": "silent",
}
I then tried changing the property name from taskName to just name, based on this link. That also didn't work.
Intellisense gives no suggestions of how to name a task.
Does anybody know how to uniquely name a task in the tasks.json file? What is the syntax? What is the property name?
Ultimately I'd like to execute two or three node.js processes before my own node.js app is launched. For example, I'd like to have the following three apps launched before my app is launched into the debugger:
sh -c 'cd ./manager/ && node manager.js'
sh -c 'cd ./adapter/ && node adapter.js'
sh -c 'cd ./core/ && node core.js'
If I'm working on a Windows box, my task might look something like this:
{
"taskName": "core-launch",
"version": "0.1.0",
// The command is tsc. Assumes that tsc has been installed using npm install -g typescript
"command": "start",
// The command is a shell script
"isShellCommand": true,
// Show the output window only if unrecognized errors occur.
"showOutput": "silent",
// args is the HelloWorld program to compile.
"args": [
"ACD-Manager",
"/B",
"/D",
"./manager/",
"node",
"manager.js"
]
}
The above task using using the cmd start capability. I'm not sure yet how to make several node tasks launch instead of one, but I can't even get one task to launch because of this task-naming issue.
How do I name a task in the tasks.json file?
FWIW, I'm using VS Code 1.20.1 and here's how I got my preLaunchTask to work:
In launch.json:
{
"version": "0.2.0",
"configurations": [
{
"type": "node",
"request": "launch",
...
"preLaunchTask": "npm: build",
}
]
}
In my package.json:
{
...
"scripts": {
"build": "tsc"
...
}
}
So, if it's still relevant, or if someone finds this thread with the same problem, I've just figured it out how it works:
In the tasks.json, you need to create a 'tasks' array - code hint will help you with that - which holds an array of objects. Inside an object, you can have the 'taskName' key-value pair.
Example:
{
"version": "0.1.0",
"command": "npm",
"isShellCommand": true,
"args": ["run-script", "webpack"],
"showOutput": "always",
"tasks": [
{
"taskName": "runwebpack",
"suppressTaskName": true
}
]
}
In my case, I had to run the npm run-script webpack command before running my project.
In the launch.json file, the "preLaunchTask": "runwebpack" will work now.
Note: the suppressTaskName is true in my example. Omitting it, or setting it to false will result in VS Code appending the taskName after the command.
A more general approach would be something like this:
{
"version": "0.1.0",
"command": "npm",
"isShellCommand": true,
"args": ["run-script"],
"showOutput": "always",
"tasks": [
{ "taskName": "webpack" }
]
}
With the latter example, you can extend the tasks array with other scripts to be run also.
Hint for my usage: npm run-script fetches what to do from the package.json file's scripts object.
Edit: this works with VS Code 1.3.1
For version 2.0.0 configuration you now use label instead of taskName.
package.json:
...
"scripts": {
"tsc": "tsc",
...
}
...
launch.json (My source is in the src directory and tsc compiles to the dist directory):
{
"version": "0.2.0",
"configurations": [
{
"type": "node",
"request": "launch",
"preLaunchTask": "Compile",
"name": "Launch Program",
"program": "${workspaceFolder}/src/index.ts",
"outFiles": [
"${workspaceFolder}/dist/**/*.js"
],
"protocol": "inspector",
"sourceMaps": true
}
]
}
tasks.json:
{
"version": "2.0.0",
"tasks": [
{
"label": "Compile",
"type": "npm",
"script": "tsc",
"problemMatcher": []
}
]
}
For vscode 1.36.1 (1.36.1):
tasks.json:
{
"version": "2.0.0",
"tasks": [
{
"label": "build:tsc",
"type": "npm",
"script": "build:tsc"
},
{
"label": "clean",
"type": "npm",
"script": "clean"
},
{
"label": "build",
"dependsOrder": "sequence",
"dependsOn": ["clean", "build:tsc"]
}
]
}
launch.json:
{
"version": "0.2.0",
"configurations": [
{
"type": "node",
"request": "launch",
"name": "Launch Program",
"program": "${workspaceFolder}/dist/main.js",
"preLaunchTask": "build",
"outFiles": ["${workspaceFolder}/dist/**/*.js"],
"console": "integratedTerminal"
}
]
}
Before running node ${workspaceFolder}/dist/main.js, the preLaunchTask will run build task firstly which includes two subtasks: clean and build. It will run clean task firstly, then run build task.
You can specify the label of a task to preLaunchTask option.
The question title is:
"Using “preLaunchTasks” and Naming a Task in Visual Studio Code
I needed to define preLaunchTask***s***.
You can config multiple tasks using the dependsOn property described here
For example, a compound task in your tasks.json:
{
"version": "2.0.0",
"tasks": [
{
"label": "Client Build",
"command": "gulp",
"args": ["build"],
"options": {
"cwd": "${workspaceRoot}/client"
}
},
{
"label": "Server Build",
"command": "gulp",
"args": ["build"],
"options": {
"cwd": "${workspaceRoot}/server"
}
},
{
"label": "Build",
"dependsOn": ["Client Build", "Server Build"]
}
]
}
You can find more information about naming tasks here.
I've only really seen the taskName used in relation to Gulp; I'm sure there are others but nothing that I have much insight into. Perhaps this can get you off to a start with what you already have?
Run a pre-launch task in VSCODE

Resources