Nativescript debugging with visual studio code not work properly - visual-studio-code

I'm try to debug the nativescript application in visual studio code but it have some problem.
The debugger stopper at the breakpoint but the variable window has not data. However, the watch window has data:
My launch.js file:
{
"version": "0.2.0",
"configurations": [
{
"name": "Launch on iOS",
"type": "nativescript",
"request": "launch",
"platform": "ios",
"appRoot": "${workspaceRoot}",
"sourceMaps": true,
"watch": true
},
{
"name": "Attach on iOS",
"type": "nativescript",
"request": "attach",
"platform": "ios",
"appRoot": "${workspaceRoot}",
"sourceMaps": true,
"watch": false
},
{
"name": "Launch on Android",
"type": "nativescript",
"request": "launch",
"platform": "android",
"appRoot": "${workspaceRoot}",
"sourceMaps": true,
"watch": true
},
{
"name": "Attach on Android",
"type": "nativescript",
"request": "attach",
"platform": "android",
"appRoot": "${workspaceRoot}",
"sourceMaps": true,
"watch": false
}
]
}
I'm using Genymotion for emulator
Do I missing any configuration?

Related

Why Visual Studio Code always break on start when debugging Next.js Full stack?

I'm debugging a Next.js 13 application using the following .vscode/launch.json file:
{
"version": "0.2.0",
"compounds": [
{
"name": "Compound",
"configurations": [],
"stopAll": false
}
],
"configurations": [
{
"name": "Next.js: debug server-side",
"type": "node-terminal",
"request": "launch",
"command": "npm run dev",
"stopOnEntry": false
},
{
"name": "Next.js: debug client-side",
"type": "chrome",
"request": "launch",
"url": "http://localhost:3000",
"stopOnEntry": false
},
{
"name": "Next.js: debug full stack",
"type": "node-terminal",
"request": "launch",
"command": "npm run dev",
"serverReadyAction": {
"pattern": "started server on .+, url: (https?://.+)",
"uriFormat": "%s",
"action": "debugWithChrome"
},
"stopOnEntry": false
}
]
}
However, every time I debug on the "Next.js: debug full stack" option, it stops on the first file (.next/server/app...) after every refresh.
Although the documentation says stopOnEntry is accepted, vscode, says its not.
Perhaps I'm using it in the wrong place.
How can I make Visual Studio code does not stop on entry?
Update
I can confirm the same issue happen when Debugging on PhpStorm. Is it a Next.js bug?
Try Using this:
{
"version": "0.2.0",
"compounds": [
{
"name": "Compound",
"configurations": [],
"stopAll": false
}
],
"configurations": [
{
"name": "Next.js: debug server-side",
"type": "node-terminal",
"request": "launch",
"command": "npm run dev",
"stopOnEntry": false
},
{
"name": "Next.js: debug client-side",
"type": "chrome",
"request": "launch",
"url": "http://localhost:3000",
"stopOnEntry": false
},
{
"name": "Next.js: debug full stack",
"type": "node-terminal",
"request": "launch",
"command": "node --inspect-brk $(which npm) run dev",
"serverReadyAction": {
"pattern": "started server on .+, url: (https?://.+)",
"uriFormat": "%s",
"action": "debugWithChrome"
}
}
]
}
Change it according to your requirements if you like.

VSCode Gatsy Debug Error with SourceMaps

I was trying to set up VSCode to be able to debug Gatsby code.
I am new to Javascript sourcemaps which seem to be the cause of the problem.
I am seeing the following error on launch:
Cannot launch program "c:\Gatsby\myprogram\node_modules\.bin\gatsby" because corresponding Javascript cannot be found.
I verified that the path to the file gatsby in the error exists.
This is the file that I am using for launch.json:
"version": "0.2.0",
"configurations": [
{
"name": "Launch",
"type": "node",
"request": "launch",
"protocol": "inspector",
"program": "${workspaceRoot}/node_modules/.bin/gatsby",
"args": ["develop", "-p", "7777"],
"stopOnEntry": false,
"cwd": "${workspaceRoot}",
"preLaunchTask": null,
"runtimeExecutable": null,
"runtimeArgs": [
"--nolazy"
],
"env": {
"NODE_ENV": "development",
"DEBUG": "gatsby:*"
},
"console": "integratedTerminal",
"sourceMaps": true,
"outFiles": []
}
]
}
I was able to get this working by using globally installed gatsby-cli's gatsby instead of the one in node_modules. So:
npm install --global gatsby-cli
and then (since I use node/npm etc under nvm):
{
"type": "node",
"request": "launch",
"name": "Launch 'gatsby develop'",
"protocol": "inspector",
"program": "${env:HOME}/.nvm/versions/node/v8.11.3/bin/gatsby",
"args": [
"develop"
],
"stopOnEntry": false,
"cwd": "${workspaceRoot}",
"preLaunchTask": null,
"runtimeExecutable": null,
"runtimeArgs": [
"--nolazy"
],
"env": {
"NODE_ENV": "development",
"DEBUG": "gatsby:*"
},
"console": "integratedTerminal",
"sourceMaps": true,
"outFiles": []
}
worked for me.
I'm on OSX though, more changes may be needed for your Windows setup.
Also: to use node under nvm with VSCode, I used the default alias method from here: Visual Studio Code to use node version specified by NVM
Quoted from the documentation
VS Code Debugger (Auto-Config)
Using VS Code’s integrated terminal run node --nolazy node_modules/.bin/gatsby develop --inspect-brk instead of gatsby develop or node --nolazy --inspect-brk node_modules/.bin/gatsby build instead of gatsby build
VS Code Debugger (Manual Config)
Linux
{
"version": "0.2.0",
"configurations": [
{
"name": "Gatsby develop",
"type": "pwa-node",
"request": "launch",
"program": "${workspaceRoot}/node_modules/.bin/gatsby",
"args": ["develop"],
"env": {
"PARCEL_WORKERS": "0",
"GATSBY_CPU_COUNT": "1",
},
"runtimeArgs": ["--nolazy"],
"console": "integratedTerminal"
},
{
"name": "Gatsby build",
"type": "pwa-node",
"request": "launch",
"program": "${workspaceRoot}/node_modules/.bin/gatsby",
"args": ["build"],
"env": {
"PARCEL_WORKERS": "0",
"GATSBY_CPU_COUNT": "1",
},
"runtimeArgs": ["--nolazy"],
"console": "integratedTerminal"
}
]
}
Windows
{
"version": "0.2.0",
"configurations": [
{
"name": "Gatsby develop",
"type": "pwa-node",
"request": "launch",
"program": "${workspaceRoot}/node_modules/.bin/gatsby",
"windows": {
"program": "${workspaceRoot}/node_modules/gatsby/dist/bin/gatsby"
},
"args": ["develop"],
"env": {
"PARCEL_WORKERS": "0",
"GATSBY_CPU_COUNT": "1",
},
"runtimeArgs": ["--nolazy"],
"console": "integratedTerminal"
},
{
"name": "Gatsby build",
"type": "pwa-node",
"request": "launch",
"program": "${workspaceRoot}/node_modules/.bin/gatsby",
"windows": {
"program": "${workspaceRoot}/node_modules/gatsby/dist/bin/gatsby"
},
"args": ["build"],
"env": {
"PARCEL_WORKERS": "0",
"GATSBY_CPU_COUNT": "1",
},
"runtimeArgs": ["--nolazy"],
"console": "integratedTerminal"
}
]
}

react jsx debug in chrome dev tools

I am using Electron (Node.js 7.4, chromium 51) with the chrome dev tools (with react and redux extensions)
I can see the react code in the react tab, but when I set breakpoints in the JSX source, and (hit them) they are not properly mapped.
I am using babel with inline source maps, so I can see the output js (es2015 preset and react presets).
I am not using a bundler (since this is an Electron project)
Has anyone else come across this?
package.json
{
"version": "0.2.0",
"configurations": [
{
"type": "node",
"request": "launch",
"name": "Main Electron Process",
"program": "${workspaceRoot}/main.js",
"stopOnEntry": false,
"args": [],
"cwd": "${workspaceRoot}",
"runtimeExecutable": "${workspaceRoot}/node_modules/.bin/electron.cmd",
"runtimeArgs": [
"."
],
"env": {},
"sourceMaps": false
},
{
"name": "Launch Chrome against localhost",
"type": "chrome",
"request": "launch",
"url": "http://localhost/NodeWork//window.html",
"webRoot": "${workspaceRoot}"
},
{
"name": "Attach to Chrome",
"type": "chrome",
"request": "attach",
"port": 9222,
"webRoot": "${workspaceRoot}"
}
]
}
launch.json (I use VSCODE)
{
"version": "0.2.0",
"configurations": [
{
"type": "node",
"request": "launch",
"name": "Main Electron Process",
"program": "${workspaceRoot}/main.js",
"stopOnEntry": false,
"args": [],
"cwd": "${workspaceRoot}",
"runtimeExecutable": "${workspaceRoot}/node_modules/.bin/electron.cmd",
"runtimeArgs": [
"."
],
"env": {},
"sourceMaps": true
},
I was loading the render page from http:// instead of file://

Dubgger for Chrome in Visual Studio Code

I am trying to debug a JavaScript program on chrome, but it does not work.
Details:
OS: Windows 10.
IDE: Visual Studio Code.
Debugger configuration (json):
{
"version": "0.2.0",
"configurations": [
{
"name": "Launch Chrome against localhost, with sourcemaps",
"type": "chrome",
"request": "launch",
"url": "http://localhost:8080",
"sourceMaps": true,
"webRoot": "${workspaceRoot}"
},
{
"name": "Attach to Chrome, with sourcemaps",
"type": "chrome",
"request": "attach",
"port": 9222,
"sourceMaps": true,
"webRoot": "${workspaceRoot}"
}
]
}
I managed to figure it out, here are the details.
I had to reconfigure the JASON file as follows:
{
"version": "0.2.0",
"configurations": [{
"name": "Launch Client Side",
"type": "chrome",
"request": "launch",
"file": "${workspaceRoot}/file_name.html",
"sourceMaps": true,
"webRoot": "${workspaceRoot}"
},
{
"name": "Launch Server Side",
"type": "chrome",
"request": "launch",
"url": "http://localhost/mypage.html",
"sourceMaps": true,
"webRoot": "wwwroot"
}
]
}
Note: In order to use the debug features of Visual Studio Code, you need to refresh the browser after you launched the HTML file.

VSCode with ElectronJs: Debuging working but console.log is not logging

I am trying to debug the electron.js application with VSCode. In order to do that, I have made the given below launch.json
{
"version": "0.2.0",
"configurations": [
{
"name": "Launch",
"type": "node",
"request": "launch",
"program": "${workspaceRoot}/main.js",
"stopOnEntry": false,
"args": [],
"cwd": "${workspaceRoot}",
"preLaunchTask": null,
"runtimeExecutable": "${workspaceRoot}\\node_modules\\electron-prebuilt\\dist\\electron.exe",
"runtimeArgs": [
".",
"--enable-logging"
],
"env": {
"NODE_ENV": "development"
},
"externalConsole": false,
"sourceMaps": false,
"outDir": null
},
{
"name": "Attach",
"type": "node",
"request": "attach",
"port": 5858,
"address": "localhost",
"restart": false,
"sourceMaps": false,
"outDir": null,
"localRoot": "${workspaceRoot}",
"remoteRoot": null
}
]
}
Problem
The debugger is stopping at the break points however the console.log is not printing in debug console.
but the debug console is not empty. Its saying...
'c:\Users\Vikas\Desktop\electron apps\todoElectron\node_modules\electron-prebuilt\dist\electron.exe' --debug-brk=36967 . --enable-logging main.js
Please help. Many thanks.