I am using Vscode.
I have a js file filled with a dozen+ class definitions which I wanted to be available in another jsfile.
So I used es6 imports in my other file, main.js
//main.js
import * as Helper from './helperClasses.js';
var myDoggy = new Helper.Pet("Fido");
But that wouldn't run with node, so I installed 'esm' with npm, and made a file called server.js, in which I added
//server.js
require = require("esm")(module/*, options*/)
module.exports = require("./main.js")
Now that runs with the code runner extension, or from a cmd window with the '-r esm' args (i.e. node -r esm server.js). But in the vsCode debugger, I get the following error:
import * as helper from './helperClasses.js';
^
SyntaxError: Unexpected token *
I tried changing the configuration settings in launch.json as follows, but that did not work:
"configurations": [
{
"type": "node",
"request": "launch",
"name": "Launch Program",
"program": "${workspaceFolder}\\game.js",
"args": ["-r","esm","server.js"]
}
]
I went and changed the .js extensions to .mjs, but then intellisense stopped working...
Is there something I'm missing? This is my first time trying to use Node and I'm just trying to easily import some helper functions.
I had a problem with the accepted answer. Using runtimeArgs worked better:
"configurations": [
{
"type": "node",
"name": "import-test-files",
"request": "launch",
"cwd": "${workspaceFolder}",
"program": "${workspaceFolder}/scripts/import-test-files.js",
"runtimeArgs": ["-r", "esm"]
}
]
Your launch.json has to be
"configurations": [
{
"type": "node",
"request": "launch",
"name": "Launch Program",
"program": "${workspaceFolder}\\server.js",
"args": ["-r","esm"]
}
]
The path of the server.js has to be accurate though. For example, in case, if it is under folder 'app' make it
"program": "${workspaceFolder}\\app\\server.js"
Let know if it helps or if the issues persits.
thats one works for me:
"configurations": [
{
"type": "pwa-node",
"request": "launch",
"name": "Launch Program",
"skipFiles": [
"<node_internals>/**"
],
"program": "${workspaceFolder}\\index.js",
"runtimeArgs": ["--experimental-modules"]
}
]
Related
I am trying to debug a project on github codespace.
However, the node debugger does not stop at the breakpoints.
That's my vscode debug config file:
{
// 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": "pwa-node",
"request": "launch",
"name": "Launch Program",
"skipFiles": [
"<node_internals>/**"
],
"program": "${file}"
}
]
}
That the repo: https://github.com/viliusle/miniPaint/
Any suggestions how to debug the above repo?
Thx in advance!
VSC: 1.42.1
Electron: 8.0.3
macOS: 10.14.5
node: 11.15.0
Here is one of the many example launch configurations I have tried. I can debug the main process successfully but the renderer process has the "breakpoint set but not bound" issue so the breakpoints are never triggered.
{
"version": "0.2.0",
"configurations": [
{
"name": "Debug Main Process",
"type": "node",
"request": "launch",
"cwd": "${workspaceRoot}",
"runtimeExecutable": "${workspaceRoot}/node_modules/.bin/electron",
"windows": {
"runtimeExecutable": "${workspaceRoot}/node_modules/.bin/electron.cmd"
},
"program": "${workspaceRoot}/main.js",
"protocol": "inspector"
},
{
"name": "Debug Renderer Process",
"type": "chrome",
"request": "launch",
"runtimeExecutable": "${workspaceRoot}/node_modules/.bin/electron",
"windows": {
"runtimeExecutable": "${workspaceRoot}/node_modules/.bin/electron.cmd"
},
"runtimeArgs": [
"${workspaceRoot}/main.js",
"--remote-debugging-port=9222"
],
"webRoot": "${workspaceRoot}"
}
]
}
Also tried this example from Microsoft's "vscode-recipes" – with the same result as above: "breakpoint set but not bound" in the renderer process.
{
"version": "0.2.0",
"configurations": [
{
"type": "node",
"request": "launch",
"name": "Electron: Main",
"protocol": "inspector",
"runtimeExecutable": "${workspaceFolder}/node_modules/.bin/electron",
"runtimeArgs": [
"--remote-debugging-port=9223",
"."
],
"windows": {
"runtimeExecutable": "${workspaceFolder}/node_modules/.bin/electron.cmd"
}
},
{
"name": "Electron: Renderer",
"type": "chrome",
"request": "attach",
"port": 9223,
"webRoot": "${workspaceFolder}",
"timeout": 30000
}
],
"compounds": [
{
"name": "Electron: All",
"configurations": [
"Electron: Main",
"Electron: Renderer"
]
}
]
}
I've been struggling for months with the "breakpoint set but not bound" issue when trying to debug the renderer process in Electron. I will spend a few hours searching around, trying sample launch configurations, trying various suggestions (e.g. Electron main and renderer process debug configuration) and then I give up, until next time. . .
It DID work in VSC 5 or 6 versions ago and then it broke. I've been all over the VSC github "issues" pages and nothing works. I am able to debug the main process.
My project structure is shown below. I am not using webpack, angular, react or any other framework like that.
Does anyone have a launch configuration that works wwith this sort of set up? "console.log()" is getting really old . . .
I'm basically exactly using your second launch.json from vscode recipes. I do now recall having similar issues and these two things worked:
Start the renderer with devtools, and then Ctrl+R inside the devtools to refresh it for breakpoints to start working. (though this will rerun the script in the renderer, which may have unexpected effects)
Start your app using the "Electron: Main" configuration. When you app has started, switch to the "Electron: Renderer" option, click the triangle, and from the dropdown that should appear in the middle of VSCode, select the one that lists your app name. Then, breakpoints should work.
I am trying to debug a simple project using babel, jest, and vs code. When I set a breakpoint and then start debugging, my breakpoints jump around and are no longer where they were when I started. A sample repo can be seen here - https://github.com/RyanHirsch/starter-node
I've updated my launch.json to contain
{
"name": "Jest",
"type": "node",
"request": "launch",
"program": "${workspaceRoot}/node_modules/jest/bin/jest.js",
"stopOnEntry": false,
"args": ["-i", "${file}"],
"cwd": "${workspaceRoot}",
"runtimeExecutable": null,
"sourceMaps": true,
"protocol": "inspector"
}
And my .babelrc looks like:
{
"plugins": ["#babel/plugin-proposal-object-rest-spread"],
"sourceMaps": "inline",
"presets": [
[
"#babel/preset-env",
{
"targets": {
"node": "6.10"
}
}
]
]
}
I thought that the source map options were enough to get this to work but I was wrong. What needs to change in order to keep my breakpoints in their original locations? Specifically when trying to debug my tests.
==== Edit ====
Before my breakpoints are on test line 10 and implementation line 4:
When I start debugging by selection my test file and then run Jest in the VS Code debug pane, my breakpoints jump to test line 9 and implementation line 6:
Running on Node 9.6.1 with the following extensions:
DavidAnson.vscode-markdownlint
EditorConfig.EditorConfig
Orta.vscode-jest
PKief.material-icon-theme
PeterJausovec.vscode-docker
Shan.code-settings-sync
bungcip.better-toml
dbaeumer.vscode-eslint
dracula-theme.theme-dracula
dzannotti.vscode-babel-coloring
eamodio.gitlens
esbenp.prettier-vscode
gerane.Theme-FlatlandMonokai
humao.rest-client
mauve.terraform
mikestead.dotenv
mjmcloug.vscode-elixir
mohsen1.prettify-json
ms-vscode.Theme-MaterialKit
ms-vscode.azure-account
ms-vscode.cpptools
ritwickdey.LiveServer
sbrink.elm
shanoor.vscode-nginx
vscodevim.vim
#RyanHirsch ; just use retainLines": true alongside sourceMap: "inline" in your babelrc and It will work.
Got this issue (using jest 23.6.0), checked that this was a known issue on create react app, resolved on this pull request:
https://github.com/facebook/create-react-app/pull/3605/files
Applied the following config to my launch.json
{
"type": "node",
"request": "launch",
"name": "Jest All",
"program": "${workspaceFolder}/node_modules/jest/bin/jest",
"args": [
"test",
"--runInBand",
"--no-cache"
],
"sourceMaps": false,
"console": "integratedTerminal",
"internalConsoleOptions": "neverOpen"
},
Managed to get it breaking on the right breakpoints.
After much struggling, here's how I got Jest with Babel debugging to consistently work and break on the correct lines.
Mainly, I used the excellent Jest plugin for VSCode by developer 'Orta', and via searching 'Jest' in the extensions pane of VSCode:
From there I just hit the Debug link that appears in my test, which allows me to correctly hit breakpoints in both my tests and application code.
Breakpoint successfully hit in the test file:
Breakpoint successfully hit in the source code file:
The correct config which works for babel-jest 25.0.0 &
jest 25.0.0 is the following:
{
"version": "0.2.0",
"configurations": [
{
"name": "Debug Jest Tests",
"type": "node",
"request": "launch",
"runtimeArgs": [
"--inspect-brk",
"${workspaceRoot}/node_modules/.bin/jest",
"--runInBand"
],
"console": "integratedTerminal",
"internalConsoleOptions": "neverOpen",
"port": 9229
}
]
}
For more information I took my config from the following repository
What worked for me is the turning off sourcemap by adding "sourceMaps": false to the launch config. I don't fully understand why it works though.
Example:
{
"type": "node",
"request": "launch",
"name": "Jest Current File",
"program": "${workspaceFolder}/node_modules/.bin/jest",
"args": [
"${relativeFile}",
"--config",
"jest.config.js",
"--no-cache"
],
"console": "integratedTerminal",
"internalConsoleOptions": "neverOpen",
"disableOptimisticBPs": true,
"sourceMaps": false,
"windows": {
"program": "${workspaceFolder}/node_modules/jest/bin/jest",
}
}
Install node:
https://nodejs.org/en/download/
Install Chrome Plugin:
https://chrome.google.com/webstore/detail/nodejs-v8-inspector-manag/gnhhdgbaldcilmgcpfddgdbkhjohddkj?hl=en
In your terminal run the following script
node --inspect-brk ./node_modules/jest/bin/jest.js --runInBand
More reference for troubleshooting in vs code follow instruction in
https://jestjs.io/docs/en/troubleshooting
{
"version": "0.2.0",
"configurations": [
{
"name": "Debug Jest Tests",
"type": "node",
"request": "launch",
"runtimeArgs": [
"--inspect-brk",
"${workspaceRoot}/node_modules/jest/bin/jest.js",
"--runInBand"
],
"console": "integratedTerminal",
"internalConsoleOptions": "neverOpen"
}
]
}
Babel will be converting es6 to es5, so its not dependent for inspecting.
For inspecting you need node and node chrome extension.
Enjoy Coding
I have a folder called foo and within that folder I have a very simple html file that should output some basic code. I don't know how to run this.
Every time I try running and compiling the html file, I get the error
"Could not find the preLaunchTask 'exe'."
This is my launch.json file:
{
"version": "0.2.0",
"configurations": [
{
"name": "Launch Extension",
"type": "extensionHost",
"request": "launch",
"runtimeExecutable": "${execPath}",
"args": [
"--extensionDevelopmentPath=${workspaceRoot}"
],
"sourceMaps": true,
"outFiles": [
"${workspaceRoot}/out/**/*.js"
],
"preLaunchTask": "exe"
}
]
Any help would be awesome, thanks!
I want to debug my protractor project built in Javascript and nodeJS with open source IDE. As I have already tried with this(VS Code), but it is unable to proceed further as there is no "sync" between browser and code.
Can any one please suggest any solution for this or rather any better alternative to this.
Note that I have already tried my luck with :
1.) Webstorm - Can't use because it is a licensed and not allowed in our Organization
2.)elementExplorer - used only for locating elements in interactive mode.
3.) Netbeans - Not supported debugging.
4.) Eclipse with nodeclipse and Webclipse- Not much effective to debug.
5.) Apatana Studio 3.0 - cannot use existing javascript & nodeJS projects .
Kindly help me out . Better solutions are welcome.
Thanks,
in command line run following command: webdriver-manager start
launch.json file is below
{
"version": "0.2.0",
"configurations": [
{
"name": "Launch",
"type": "node",
"request": "launch",
"program": "c:/Users/yourUserName/AppData/Roaming/npm/node_modules/protractor/bin/protractor",
"args": [
"${workspaceRoot}/conf.js"
],
"stopOnEntry": false,
"cwd": "${workspaceRoot}",
"preLaunchTask": null,
"runtimeExecutable": null,
"runtimeArgs": [
"--nolazy"
],
"env": {
"NODE_ENV": "development"
},
"externalConsole": false,
"sourceMaps": false
},
{
"name": "Attach",
"type": "node",
"request": "attach",
"port": 5858,
"address": "localhost",
"restart": false,
"sourceMaps": false,
"localRoot": "${workspaceRoot}",
"remoteRoot": null
},
{
"name": "launch",
"type": "node",
"request": "launch",
"processId": "${command.PickProcess}",
"port": 5858,
"sourceMaps": false,
"outDir": null
}
]
}