vscode How to change `package scripts` to` launch debug`? - node.js

package.json
"scripts": {
"start": "node -r dotenv/config index.js dotenv_config_path=.env",
.vscode\launch.json
{
// https://go.microsoft.com/fwlink/?linkid=830387
"version": "0.2.0",
"configurations": [
{
"type": "node",
"request": "launch",
"name": "debug",
"skipFiles": ["<node_internals>/**"],
"program": "${workspaceFolder}\\index.js",
"args": ["-r dotenv/config index.js dotenv_config_path=.env"]
}
]
}
I want to debug, but he can't work, How do I configure launch.json?

Please check Add Configuration button on lower right corner of launch.json.
Sample npm task configuration generated from same:
{
"type": "node",
"request": "launch",
"name": "Launch via NPM",
"runtimeExecutable": "npm",
"runtimeArgs": [
"run-script",
"debug"
],
"port": 9229
}
Screenshot:
Adding additional configuration:

Related

How to pass arguments to node script from launch configuration in vscode

Why isn't my launch configuration in vscode picking up on args key?
vscode Version: 1.63.2
launch.json
"version": "0.2.0",
"configurations": [
{
"command": "node ${workspaceFolder}/test.js",
"args": ["foo"],
"name": "test",
"request": "launch",
"type": "node-terminal",
},
]
}
test.js
console.log("running script");
console.log(process.argv);
I press play from debug sidebar and get this in console:
$ node /Users/acohen/mp/mobileapp-client-tests/test.js
Debugger attached.
running script
[
'/Users/acohen/.nvm/versions/node/v12.16.2/bin/node',
'/Users/acohen/mp/mobileapp-client-tests/test.js'
]
Waiting for the debugger to disconnect...
Why isn't "foo" passed as an argument?
Here is a config example that worked for me:
{
"configurations": [
{
"name": "Launch Program",
"args": ["foo"],
"program": "${workspaceFolder}/test.js",
"request": "launch",
"type": "pwa-node"
}
]
}
Ok, what I ultimately wanted to do was run a complex npm script and debug it. I re-installed vscode, and found some good docs here:
https://code.visualstudio.com/docs/nodejs/nodejs-debugging#_launch-configuration-support-for-npm-and-other-tools
and here for using nvm:
https://code.visualstudio.com/docs/nodejs/nodejs-debugging#_multi-version-support
My launch.json looks like this:
where test_ios is the npm script to debug and 14.17.3 is the version of node (installed with nvm) to use:
"version": "0.2.0",
"configurations": [
{
"name": "Launch via npm",
"type": "node",
"request": "launch",
"cwd": "${workspaceFolder}",
"runtimeExecutable": "npm",
"runtimeArgs": ["run-script", "test_ios"],
"runtimeVersion": "14.17.3"
}
]
}

Deno - Could not target to debug target

I have same configuration to run debug for Deno and it run well at Pop OS until it crashed and I installed again Ubuntu 20.04.
Here is my launch.json
{
"configurations": [
{
"type": "pwa-node",
"request": "launch",
"name": "Launch Deno",
"program": "${workspaceFolder}/index.ts",
"cwd": "${workspaceFolder}",
"runtimeExecutable": "/home/transonhoang/.deno/bin/deno",
"runtimeArgs": [
"run",
"--inspect-brk=127.0.0.1:9229",
"--allow-all",
"--unstable"
],
"attachSimplePort": 9229
}
]
}
When I run debug, the screen will show a popup like image below:
I really need help on this. Thanks for your time.
Here is my solution after figuring out.
change launch.json to
{
"version": "0.2.0",
"configurations": [
{
"name": "Deno",
"type": "pwa-node",
"request": "launch",
"cwd": "${workspaceFolder}",
"runtimeExecutable": "deno",
"runtimeArgs": [
"run",
"-A",
"--inspect-brk",
"--unstable",
"index.ts"
],
"attachSimplePort": 9229,
"outputCapture": "std"
}
]
}
Migrate my Deno version to 1.7

How to debug Typescript code in Visual Studio Code with ts-node-dev and correct line numbers

I have a Typescript project that is launched as follows:
ts-node-dev --preserve-symlinks --inspect=0.0.0.0 -- src/server.ts
I can debug it with Visual Studio Code, but the debugger breaks at the wrong lines. The only reasonable explanation I can think of, is that ts-node-dev does not point the debugger to the source maps (which are there).
How can I correctly debug Typescript code executed by ts-node-dev?
Configuration for debugging in vs code with ts-node-dev to attach and launch debugger:
package.json:
{
"scripts": {
"dev:debug": "ts-node-dev --transpile-only --respawn --inspect=4321 --project tsconfig.dev.json src/server.ts",
"dev": "ts-node-dev --transpile-only --respawn --project tsconfig.dev.json src/server.ts",
}
}
launch.json:
{
"version": "0.1.0",
"configurations": [
{
"type": "node",
"request": "attach",
"name": "Attach to dev:debug",
"protocol": "inspector",
"port": 4321,
"restart": true,
"cwd": "${workspaceRoot}"
},
{
"type": "node",
"request": "launch",
"name": "Debug",
"protocol": "inspector",
"cwd": "${workspaceRoot}",
"runtimeExecutable": "npm",
"runtimeArgs": ["run-script", "dev"]
}
]
}
I had the same question, which brought me to this (old) post. I found the solution to my problem at https://gist.github.com/cecilemuller/2963155d0f249c1544289b78a1cdd695 so am posting it here in case anyone else finds themselves here!
This VS Code configuration allowed me to stop at breakpoints on the correct lines in my TypeScript code:
{
"version": "0.2.0",
"configurations": [
{
"name": "Example",
"type": "node",
"request": "launch",
"runtimeExecutable": "node",
"runtimeArgs": ["--nolazy", "-r", "ts-node/register/transpile-only"],
"args": ["src/script.ts", "--example", "hello"],
"cwd": "${workspaceRoot}",
"internalConsoleOptions": "openOnSessionStart",
"skipFiles": ["<node_internals>/**", "node_modules/**"]
}
]
}
This is what worked for me. attach type debugger was not working for me but launch type is working fine. Breakpoints works as well even though sometimes it goes to the ts-node-dev source files and I guess we can't do anything about it.
It runs tsnd which is just the alias for ts-node-dev.
{
"version": "0.2.0",
"configurations": [
{
"type": "pwa-node",
"name": "launch",
"request": "launch",
"runtimeExecutable": "${workspaceFolder}/node_modules/.bin/tsnd",
"program": "${file}",
"args": [
"--transpile-only",
"--respawn",
"--project",
"tsconfig.dev.json",
],
"skipFiles": [
"<node_internals>/**"
],
},
}
"program" could be changed to run a specific file by replacing ${file} with that filename but with the above config, it will run the opened file with the debugger.

.env with debugging breakpoint using vscode and dotenv npm

I'm using a nodejs server side api, setting up environment variables with dotenv npm package, and running the code from npm scripts in package.json as below:
"scripts": {
"local": "cross-env NODE_ENV=local nodemon ./bin/www"
}
What I need is to configure my .vscode/launch.json file.
Currently it looks like:
{
// 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": []
}
Kindly guide me. Thanks,
Gopal.R
dotenv npm package
Visual Studio Code - Launch configurations
You would want to set the .dotenv environmental variable up like:
NODE_ENV=local
Then to require it in your debugger, you would want to add it into your launch.json configurations like:
"runtimeArgs": [
"--require=dotenv/config"
]
Here it is in context:
{
// 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": "launch",
"name": "Launch | local with dotenv config",
"program": "${workspaceFolder}/bin/www/your_script.js",
"runtimeArgs": [
"--require=dotenv/config"
]
}
]
}
--require=dotenv/config is the equivalent of running require('dotenv').config() in your script or node -r dotenv/config your_script.js if you're using the command line.
Here are some alternate examples of where environmental variables can be placed in the config.
{
// 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": "launch",
"name": "Launch | local using env file",
"program": "${workspaceFolder}/bin/www/your_script.js",
"envFile": "${workspaceFolder}/.env"
},
{
"type": "node",
"request": "launch",
"name": "Launch | local without dotenv",
"program": "${workspaceFolder}/bin/www/your_script.js",
"env" : {
"NODE_ENV" : "local"
}
}
]
}
Note: This code hasn't been tested... so feedback is welcome.
I had the same question for typescript debugging and I found answer here. Need to specify runtimeArgs and envFile parameters to make it work.
Example of launch.json for TypeScript debugging:
{
"version": "0.2.0",
"configurations": [
{
"type": "pwa-node",
"request": "launch",
"name": "Launch Program",
"skipFiles": [
"<node_internals>/**"
],
"program": "${workspaceFolder}/src/server.ts",
"preLaunchTask": "tsc: build - tsconfig.json",
"outFiles": [
"${workspaceFolder}/built/**/*.js"
],
"runtimeArgs": [
"--require=dotenv/config"
],
"envFile": "${workspaceFolder}/.env"
}
]
}

How can I make VSCode run a node app like "npm start"?

I have a node app with the package.json like so:
{
"name": "myexpressapp",
"version": "0.0.99",
"scripts": {
"start": "node ./bin/www" },
//etc
}
and in app.js I have
console.log ("Running version: "+process.env.npm_package_version);
When I run npm start in the command prompt this logs
Running version: 0.0.99
When I start (press F5) in VS Code this logs
Running version: undefined
What change do I need to make to launch.json to start the app in VS Code as if I had entered npm start in the command prompt?
I can now get it to run (but not debug) using the following launch.json:
{
"version": "0.2.0",
"configurations": [
{
"type": "node",
"request": "launch",
"name": "Launch via NPM#3",
"runtimeExecutable": "npm",
"windows": {
"runtimeExecutable": "npm.cmd"
},
"runtimeArgs": [
"start"
],
"port": 5858,
"cwd": "${workspaceRoot}"
},
{
"type": "node",
"request": "launch",
"name": "Launch Program#1",
"program": "app.js",
"cwd": "${workspaceRoot}"
}
]
}

Resources