Visual studio code Unverified breakpoint for PhantomJS - phantomjs

My issues is, that VSC does not brake on a brake-point while debugging PhantomJS file..
There is only 1 js file. ! I did re-installed VSC, phantomjs, etc.. But no luck.?!
I did followed tutorial on GitHub, also googled about this issue, but still VSC just displays:
Unverified breakpoint, Breakpoint ignored because generated code not found (source map problem?)
My launch.json looks like this:
{
"version": "0.2.0",
"configurations": [
{
"name": "Launch",
"type": "phantomjs",
"request": "launch",
"file": "C:/Users/TSS/Desktop/PhantomJS/bin/hello.js",
"webRoot": "C:/Users/TSS/Desktop/PhantomJS",
"runtimeExecutable": "C:/Users/TSS/Desktop/PhantomJS/bin/phantomjs.exe",
"runtimeArgs": [],
"scriptArgs": [],
"sourceMaps": true
}
]
}
Folders structure is also very simpple:

I just downgraded to older VSC version and it works.. For some reason !

Related

Why is debugging VueJS so flaky in VSCode

I have been using VSCode for a few months and have not been able to find a way to consistently debug a simple VueJS app. The main issue I keep encountering is the Unbound breakpoint whereby the breakpoints I set are unreachable.
I have tried the many launch.json configs including the ones below with no success:
{
"name": "Launch Chrome",
"request": "launch",
"type": "pwa-chrome",
"url": "http://localhost:8080",
"webRoot": "${workspaceFolder}"
},
{
"name": "Attach hm",
"port": 9229,
"request": "attach",
"skipFiles": ["<node_internals>/**"],
"type": "pwa-node",
"address": "localhost:8080",
"localRoot": "${workspaceFolder}/src"
}
A few weeks ago I stumbled on the following config which magically solved my problem and I was happily debugging for days:
{
"type": "chrome",
"request": "launch",
"name": "Launch Chrome against localhost",
"url": "http://localhost:8080",
"webRoot": "${workspaceFolder}/src",
"breakOnLoad": true,
"sourceMaps": true
}
After taking a few days off coding, I came back to VSCode yesterday, there was the 1.47.2 update waiting. Did that, wrote a few lines of code, tried debugging like i was doing before and boom! the Unbound breakpoint problem from hell returned.
Check my commits, no changes to launch.json, no new install, updates whatsoever.
Why on Earth diid this thing stop working???
One thing to note is that I can perfectly debug in VSCode the server portion of my app (a node/express REST server) with no problem at all.
Very frustrating and I really do not want to go back to debugging using Chrome's DevTools.
Could anyone help?
thank you.
I experienced may times similar issues.
Have you found a solution?
My launch.json file is:
{
"version": "0.2.0",
"configurations": [
{
"type": "chrome",
"request": "launch",
"name": "vuejs: chrome",
"url": "http://localhost:3000",
"webRoot": "${workspaceFolder}/src",
"breakOnLoad": true,
"pathMapping": {
"/_karma_webpack_": "${workspaceFolder}"
},
"sourceMapPathOverrides": {
"webpack:/*": "${webRoot}/*",
"/./*": "${webRoot}/*",
"/src/*": "${webRoot}/*",
"/*": "*",
"/./~/*": "${webRoot}/node_modules/*"
}
}
]
}
Most of times it works but I still experience weird behaviors.
Also you should always start VS Code from within the folder containing the VUE project (outside /src).

vs code extension develop. hellow world can't run

I follow the https://code.visualstudio.com/api/get-started/your-first-extension tutorial, but when i came to "Then, inside the editor, press F5. This will compile and run the extension in a new Extension Development Host window." .I got a "building..." and nothing else.enter image description here
I have no idea what to do.
Please check if your launch.json inside the .vscode has configuration like following:
{
"name": "Run Extension",
"type": "extensionHost",
"request": "launch",
"runtimeExecutable": "${execPath}",
"args": [
"--extensionDevelopmentPath=${workspaceFolder}"
],
"outFiles": [
"${workspaceFolder}/out/**/*.js"
],
"preLaunchTask": "${defaultBuildTask}"
}
Also, try by re-installing all the packages before running F5.

How to setup vscode / chrome debugger with webpack when vue project in sub directory

I am coding a CLI project in vue using VS code and trying to get my debugger setup properly, but I can't seem to get the proper overrides setup for webpack. My workspace folder is Project and I have two sub folders api for my server code and client for my vue code. The following launch.json setting seem to stop my code in the correct place, but the little debugger dots jump up 3 lines when I start it up.
{
"version": "0.2.0",
"configurations": [
{
"type": "chrome",
"request": "launch",
"name": "vuejs: chrome",
"url": "http://localhost:8080",
"webRoot": "${workspaceFolder}/client/src",
"breakOnLoad": true,
"sourceMapPathOverrides": {
"webpack:///*": "${webRoot}/*",
"webpack:///./*": "${webRoot}/*",
"webpack://./src/*": "${webRoot}/*"
}
}
]
}
I am also using vue router if that makes a difference.

vscode launch.json react-native & Haxe

I started moving from coding directly react-native project with Haxe.
Therefore the folder-structure has changed, that the react-native project files are in a subfolder of the current project.
When i do want to use the launch.json the output tells me (correctly) that there is no react-native npm package installed at root.
my launch.json looks like this now (tried to add rn-project-name) as a subfolder
{
"version": "0.2.0",
"configurations": [
{
"name": "Debug iOS",
"program": "${workspaceRoot}/rn-project-name/.launch/launchReactNative.js",
"type": "reactnative",
"request": "launch",
"platform": "ios",
"target": "iPhone 5s",
"sourceMaps": true,
"outDir": "${workspaceRoot}/rn-project-name/.vscode/.react"
}
]
}
Has anyone ever had to solve something like this?
(I somehow do not understand how the launch.json sets up all neccessary file references)
I've managed to get it working. Just edit .vscode/settings.json adding the project root path:
{
...
"react-native-tools": {
"projectRoot": "path-to-your-rn-project"
}
}

VS code debugging ASP.NET + Chrome

Is it possible to configure VS code to debug seamlessly solutions with server code in ASP.NET Core and JS files in Chrome.
Something available in full VS (unfortunately only in IE).
I can put breakpoints on both JS files and CS files.
Thanks for help!
Create one configuration for the ASP.NET Core application and another one for Chrome (you need the Debugger for Chrome extension). Then create a composite launch configuration.
When you start debugging using the composite configuration you will be able to debug the ASP.NET code as well as the Javascript/Typescript code in the same Visual Studio Code instance. You can also launch each configuration manually and it should work.
Your launch.json file should look something like this (with an ASP.NET Core application called myapp):
{
"version": "0.2.0",
"compounds": [
{
"name": "Browser/Server",
"configurations": [
"Server",
"Browser"
]
}
],
"configurations": [
{
"name": "Server",
"type": "coreclr",
"request": "launch",
"preLaunchTask": "build",
"program": "${workspaceRoot}/bin/Debug/netcoreapp1.1/myapp.dll",
"args": [],
"cwd": "${workspaceRoot}",
"env": {
"ASPNETCORE_ENVIRONMENT": "Development"
},
"sourceFileMap": {
"/Views": "${workspaceRoot}/Views"
}
},
{
"name": "Browser",
"type": "chrome",
"request": "launch",
"url": "http://localhost:5000",
"webRoot": "${workspaceRoot}/wwwroot"
},
]
}
Simple way :
Close IE but debuging are Running
Choose Lunch Chrome (must config lunch.json URL same )