I have launch configuration for my Nodejs with ExpressJs application, the debugger mode starts and then immediately stops.. It doesn't keep on listening.. any help is much appreciated.
{
"name": "Launch via NPM",
"type": "node",
"request": "launch",
"cwd": "${workspaceFolder}/index.js",
"runtimeExecutable": "npm",
"runtimeArgs": [
"run-script", "debug"
],
"port": 9229
}
Below is my server configuration
app.listen(PORT, HOST, () => {
process.stdout.write(Server is listening on ${PORT} (${NODE_ENV})\n)
log.info(Server is listening on ${PORT} (${NODE_ENV})\n)
})
Start commands in package.json
"devStart": "nodemon --exec babel-node index.js",
"start": "per-env",
"start:development": "nodemon --exec babel-node index.js",
The issue is resolved by below steps..
1.) Followed the steps as suggested by Mickers in the above comments
2.) (for the async module issue ) rm -rf node_modules
followed by -- npm install
The debugger is successfully attached
Related
I'm having trying to debug my app on Visual Studio Code. I have the following config on my package.json:
"scripts": {
"build": "rimraf dist/ && babel ./ --out-dir dist/ --ignore ./node_modules,./.babelrc,./package.json,./npm-debug.log --copy-files",
"start": "npm run build && node --inspect=12345 dist/app.js"
}
Im using ES6 on my Node app, that's why it is kinda messy my build config.
When I run npm start everything works fine, I can use my app.
Now to try to debug it, I have set the following launch configurations:
"configurations": [
{
"type": "node",
"name": "Attach to Remote",
"request": "attach",
"port": 12345
},
{
"type": "node",
"request": "launch",
"name": "Launch Program",
"program": "${workspaceFolder}\\dist\\app.js"
}
]
Both of them ""work"": VS Code switch to "debug mode" but I can't hit any breakpoints. They all get grayed out:
I have tried to fix using this answer, but couldn't get it to work...
Any help?
Thanks in advance!
I am using VS Code v 1.28.2 and I'm able to debug both ways.
1) With the built in debuger ( Menu -> Debug -> Start Debuging)
2) starting the application with node inspect index.js. In that case you have to declare breakpoints in your code with the debugger; keyword. Then, when in debug-mode and stoped in a breakpoint, you continue execution typing cont in the command line.
hope it helps
I found out I was just missing the --source-maps from my babel-cli command... -.-
After adding it, VSCode is able to find the breakpoints.
So basically the solution was:
Add --source-maps to my build command:
"scripts": {
"build": "rimraf dist/ && babel ./ --out-dir dist/ --ignore ./node_modules,./.babelrc,./package.json,./npm-debug.log --copy-files --source-maps",
"start": "npm run build && node --inspect=12345 dist/app.js"
}
And I configured a launch as follows:
"configurations": [
{
"type": "node",
"request": "launch",
"name": "Launch Program",
"program": "${workspaceFolder}\\dist\\app.js",
"preLaunchTask": "npm: build"
}
]
Hope it helps someone!
I have two Serverless Offline "servers" which I need to run locally at same time.
So I need to change the port of one of the servers.
I run a server using Visual Studio Code debugger. The configs of the servers are in launch.json files.
How can I change the port of a Serverless Offline application so that I can run it in parallel with another Serverless Offline application using VS Code debugger?
If you are using windows, update the vscode launch.json and package.json as below :
// launch.json
{
"version": "0.2.0",
"configurations": [
{
"type": "node",
"request": "launch",
"name": "Debug Serverless",
"cwd": "${workspaceFolder}",
"runtimeExecutable": "npm",
"runtimeArgs": [
"run",
"debug"
],
"outFiles": [
"${workspaceFolder}/handler.js"
],
"port": 9229,
"sourceMaps": true
}
]
}
// package.json
....
"scripts": {
"debug": "SET SLS_DEBUG=* && node --inspect %USERPROFILE%\\AppData\\Roaming\\npm\\node_modules\\serverless\\bin\\serverless offline -s dev"
}
If on linux your debug script will be:
// package.json
....
"scripts": {
"debug": "export SLS_DEBUG=* && node --inspect /usr/local/bin/serverless offline -s dev"
}
Solved by adding the following lines to the serverless.yml file:
custom:
serverless-offline: ## add this two lines
port: 4000 ## bellow "custom:" line
I'm using a Linux system, here is what my launch.json and package.json files look like.
launch.json
{
"version": "0.2.0",
"configurations": [
{
"type": "pwa-node",
"request": "launch",
"name": "Debug Serverless",
"cwd": "${workspaceFolder}",
"runtimeExecutable": "npm",
"runtimeArgs": [
"run",
"debug"
],
"sourceMaps": true,
"attachSimplePort": 9229
}
]
}
package.json
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"debug": "node --inspect node_modules/serverless/bin/serverless offline -s dev"
},
When I type npm run debug into the console I get: "Debugger listening on ws://127.0.0.1:3090/d17dfe56-4fa4-4686-a62e-d07cff78c834". When I go to this adress in chrome the only thing I see is "WebSockets request was expected". What parts of my config should I tweak to make the debugger work? I'm using the latest version of nodejs.
package.json scripts
"scripts": {
"prod": "webpack -p --env.production --progress",
"start": "babel-node --presets es2015 server/server.js",
"watch": "nodemon --exec npm run start",
"debug": "babel-node --presets es2015 server/server.js --inspect --debug-brk=3090"
}
launch.json:
{
"version": "0.2.0",
"configurations": [
{
"name": "Launch via NPM",
"type": "node",
"request": "launch",
"runtimeExecutable": "npm",
"program": "${workspaceRoot}/server/server.js",
"restart": true,
"runtimeArgs": [
"run-script", "debug"
],
"port": 3090
},
{
"type": "chrome",
"request": "launch",
"name": "Launch Chrome against localhost",
"url": "http://localhost:3090",
"webRoot": "${workspaceRoot}"
},
{
"type": "chrome",
"request": "attach",
"name": "Attach to Chrome",
"port": 3090,
"webRoot": "${workspaceRoot}"
}
]
}
File structure:
├───.vscode
├───js
├───server
│ ├───db
│ ├───middleware
│ ├───models
│ ├───server.js
This seems to be an issue with nodejs library version >= 7.0.0.
First Workaround:
A small workaround to open this file in chrome with dev tools is to copy the code of link after ws in your case:
Debugger listening on ws://127.0.0.1:3090/d17dfe56-4fa4-4686-a62e-d07cff78c834
and append it in the end of the line of dev tools link with ws= just as shown below:
chrome-devtools://devtools/bundled/inspector.html?experiments=true&v8only=true&ws=127.0.0.1:3090/d17dfe56-4fa4-4686-a62e-d07cff78c834
This will enable you to open your program in chrome dev tools. Link and solution to the issue is given here
Second Workaround:
I tried installing old version of node i.e. 6.11.2 and npm 3.10 and gave it a try in visual studio code, it was working perfectly fine without any problems.
however, with the trick shown above in first method I am still able to use latest version of both node and npm.
EDIT: Formatted my answer for better understanding
I'm atempting to run the node command npm run dev from the debugger in vscode.
My run config in launch.json:
"configurations": [{
"type": "node",
"request": "launch",
"name": "Launch via NPM",
"runtimeExecutable": "npm",
"runtimeArgs": [
"run",
"dev"
],
"cwd": "${workspaceRoot}"
}]
My scripts in package.json:
"scripts": {
"dev": "npm run build:live",
"build:live": "nodemon --exec ./node_modules/.bin/ts-node -- ./app/*.ts"
}
But when i run the config i get this output:
npm --debug-brk=18538 run dev
> discordbot#1.0.0 dev /home/olian04/Documents/Projects/Node/JavaScript/DiscordBot.js
> npm run build:live
> discordbot#1.0.0 build:live /home/olian04/Documents/Projects/Node/JavaScript/DiscordBot.js
> nodemon --exec ./node_modules/.bin/ts-node -- ./app/*.ts
[nodemon] 1.11.0
[nodemon] to restart at any time, enter `rs`
[nodemon] watching: *.*
[nodemon] starting `./node_modules/.bin/ts-node ./app/index.ts`
And then this error:
Cannot connect to runtime process (timeout after 10000 ms).
To me it looks as if it worked, but it still throws an error, and the code stops running when it does, why?
I ended up adding the "port" tag to the "configurations".
And the --debug-brk argument to the "build:live" node command.
Final configs:
"configurations": [{
"type": "node",
"request": "launch",
"name": "Launch via NPM",
"runtimeExecutable": "npm",
"runtimeArgs": [
"run",
"dev"
],
"port": 5858,
"cwd": "${workspaceRoot}"
}]
Final script:
"scripts": {
"dev": "npm run build:live",
"build:live": "nodemon --debug-brk=5858 --exec ./node_modules/.bin/ts-node -- ./app/*.ts"
}
I have a NodeJS project which I can start from command line with yarn start command. My package.json looks similar to this:
{
"name": "projectname",
"version": "0.0.1",
"description": "",
"author": "My Name",
"license": "",
"scripts": {
"start": "yarn dev",
"dev": "yarn stop && pm2 start pm2-dev.yaml && webpack-dev-server --progress",
"prod": "yarn stop && yarn build && pm2 start pm2-prod.yaml",
"build": "rimraf dist lib && babel src -d lib --ignore test.js && cross-env NODE_ENV=production webpack -p --progress",
"stop": "rimraf logs/* && pm2 delete all || true"
},
"dependencies": {
"body-parser": "~1.16.0",
"ejs": "2.5.5",
"express": "^4.14.1",
"pg": "^6.1.2",
"react": "^15.4.2",
"redux": "^3.6.0",
},
"devDependencies": {
"babel-cli": "^6.22.2",
"cross-env": "^3.1.4",
"eslint": "^3.13.0",
"pm2": "^2.3.0",
"redux-mock-store": "^1.2.2",
"rimraf": "^2.5.4",
"webpack": "^2.2.1",
"webpack-dev-server": "^2.2.1"
}
}
I am trying to start this project in debugging mode with Visual Studio Code but with almost no luck. I have defined my launch configuration in VS Code launch.json file like this:
{
// Use IntelliSense to learn about possible Node.js debug 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": "yarn",
"runtimeExecutable": "yarn",
"runtimeArgs": [
"start"
],
"port": 5858,
"cwd": "${workspaceRoot}",
"timeout": 10000
}
]
}
The problem with this configuration is that it usually times-out because webpack-dev-server build is longer than 10 seconds. I can increase the timeout in my configuration, but I have noticed that VS Code results with a message Cannot connect to runtime process (timeout after 30000 ms). eventually, so I assume that this is not a good solution. Also, my breakpoints are ignored with this kind of config which tells me that I am definitely doing something wrong here.
This is the first time I am trying out Visual Studio Code and I usually don't use NodeJS, but I got this project with all these scripts in package.json already defined so I'm trying to adopt to it and therefore all the confusion about how to run it properly.
Can Visual Studio Code run a project like this with full debugging functionality at all, and if so, how should I configure my launch script?
I ended up having the following configuration in launch.json:
{
"type": "node",
"request": "launch",
"name": "Launch via Yarn",
"runtimeExecutable": "yarn",
"cwd": "${workspaceFolder}",
"runtimeArgs": ["start:debug"],
"port": 5858
}
And the following entry in the scripts property inside package.json:
"start:debug": "node --inspect-brk=5858 ./server/index.js",
You could include a timeout key (which defaults to 10000) and increase its value if have any prestart:debug script in your package.json which could lead to delay the launch of the actual node app.
I can't specifically answer the webpack parts of the question. However, your script above won't work because you haven't enabled debugging. Exposing debugging allows a debugger to attach to this process, and it also blocks program execution until a debugger attaches. You'll need to make another script in your package.json that allows for debugging. Then, you can use your debugging-specific script to debug and your non-debugging script to run normally. For example:
"scripts": {
"start": "yarn dev",
"dev": "node entry.js",
"dev-debug": "node --inspect-brk=5858 entry.js",
Then, in your launch.json replace "start" with "dev-debug". The debugging port is already set to 5858 in both launch.json and package.json, so this should work. The key is running node with the --inspect-brk command, forcing the execution of the node app to stop until a debugger attaches to it.
Additionally to the above - to get mine working I had to add the following to my package.json (the exec was still required) -
"start:debug": "nodemon --inspect-brk=5858 --exec \"babel-node\" src/index.js"
Haven't used the debugged in VS Code however I'm using nodemon to debug with Chrome with a shell script.
bin_dir="$__dirname/../node_modules/.bin"
src_dir="$__dirname/../src"
"$bin_dir/nodemon" --ext js,yaml \
--watch "$src_dir/package.json" \
--watch "$src_dir" \
"$src_dir/index.js" \
--exec "yarn && babel-node --inspect=0.0.0.0:9229"
Open chrome://inspect/#devices and start up your debugger
Thanks for the information shared in this thread, What exactly is the 'react-scripts start' command?, by #johndpope.
Here is the setup I used in vscode's launch.json file in configurations section for launching a react process.
{
"name": "Launch: Frontend Server",
"program": "${workspaceFolder}/node_modules/react-scripts/bin/react-scripts.js",
"args": ["start"],
"request": "launch",
"type": "node",
"console": "integratedTerminal",
"localRoot": "${workspaceFolder}",
}
So, response to the original post, you may try to see what is the script used in rimraf library.