How to debug typescript in Intellij IDEA - node.js

Image shows my Project Structure.I am writing back-end for order app in typescript with mongoose database.I am using 'intellij-IDEA' IDE for development. Project run with gulp task runner.I am testing my api's with postman.In some cases, I am unable to track the flow of code from project. I have tried printing with 'console.log()'. But, it has limits. So, help me to debug typescript as it doesn't involve any browser activity.

I was able to get IntelliJ to debug Node Typescript apps while using nodemon as the node interpreter and ts-node as the inline transpiler. No need to pre-compile the code, ts-node does it real-time in memory.
// nodemon.json
{
"execMap": {
"js": "node",
"ts": "./node_modules/.bin/ts-node"
},
"watch": [
"app",
"config"
],
"ext": "js,ts"
}
Then run the Node.JS run configuration in Debug mode, and breakpoints are hit!
If using Linux, change the node interpreter to ./node_modules/bin/nodemon (without .cmd)

You can use node-instpector, it does a good job helping debug NodeJS apps. Here's a good tutorial.

Related

Node.js live debugging in VSCode doesn't work

I have a small project (but issue also appears on the one created by npx create-react-app my-app). I use VsCode and developing inside container (https://code.visualstudio.com/docs/remote/containers) . Dockerfile is very minimal:
ARG VARIANT="16-bullseye"
FROM mcr.microsoft.com/vscode/devcontainers/javascript-node:0-${VARIANT}
devcontainer.json has, almost, just defaults:
{
"name": "Node.js",
"build": {
"dockerfile": "Dockerfile",
"args": { "VARIANT": "16-bullseye" }
},
"settings": {},
"extensions": [
"dbaeumer.vscode-eslint"
],
"remoteUser": "node"
}
To debug, I run npm start , then I (for the 1st time) i click on Debug URl.
On macOS everything works, including file monitoring, so when I change js file, npm is recompiling instantly.
On Windows 11 however, the last part doesn't work - I need to stop and start npm manually, to have changes implement.
I've even tried to remove .vscode directory from my profile - no change here...
Any idea what is going on? Why it does work on macOS and doesn't work on Windows ?
I have the same extensions on both systems...I just can't find what is going on with Windows machine...
EDIT: the issue seems to be related to "Remote Development" extension for vscode . Issue is present only when using this extension on Windows. So I've opened a bug there: https://github.com/microsoft/vscode-remote-release/issues/6633

NodeJs Debugging Client-Side Visual Studio Code with FuseJs

I have two application which has developed with Typescript. They are server-side and client-side application. I used NodeJs for them. On client-side also used fuseJs for hot-reload feature. But I have a problem I can't debug the client-side application. I'm always writing to console and there is so much "console.log() lines".
I can debug my server-side. But I can't debug client-side.
Here is my fusejs configuration:
const { FuseBox, WebIndexPlugin, CSSPlugin, CSSResourcePlugin } = require("fuse-box");
const { src } = require("fuse-box/sparky");
const fuse = FuseBox.init({
tsConfig: "tsconfig.json",
homeDir: "src",
target: "browser#es6",
output: "dist/$name.js",
plugins: [
WebIndexPlugin({template:'src/dashboard.html'}),
CSSPlugin()],
});
fuse.dev({port:8080});
fuse
.bundle("app")
.instructions(" > main.ts")
.hmr()
.watch();
fuse.run();
I was run my client-side app like: node fuse.js but I read this docs: https://nodejs.org/api/debugger.html then I added "debugger" line to my code and I run it: node inspect fuse.js
But I can't still debugging it. Somebody suggested chrome debug extension but I don't want change my any config or don't want to be reason for it. Is there any other way before try this extension? Can anybody help me?

How to debug a Node.js server? The debugger skips my breakpoints! (Using VSCode)

I'm trying to debug a Next.js app with a custom server which I normally run with a dev Yarn script that executes node server.js.
VSCode includes a Node.js debugging extension and this guide, which I've followed. I created a new Yarn script called dev:debug that runs node --inspect server.js, and the following configuration in launch.json:
{
"type": "node",
"request": "launch",
"name": "Debug via Yarn",
"runtimeExecutable": "yarn",
"runtimeArgs": ["dev:debug"],
"port": 9229
}
However some breakpoints in modules imported by server.js are skipped and I'm not sure why. Other breakpoints in Next components do work when I load pages in my web app. Any ideas?
OK! Here's what's happening (and I'm posting all this to SO because I couldn't find the answer online):
When you build a Next.js app, you're writing BOTH the server app (node), AND the server-side web app (next), which are separate things! Additionally, you're also building a client-side app (React) on top of that. (If you're used to other platforms like PHP or Python web apps that use servers like the built-in ones, Apache, or NginX, this isn't obvious!)
Running node --inspect server.js tells the debugger to load the server and THEN start debugging your web app ONLY ("user code").
Solution: node CLI has a special --inspect-brk option to use when you also want to debug the code of the server itself! Yep, the solution is 4 more characters (-brk).

Using Intern for nodejs only app

I was trying running intern-client for nodejs server-side application. The terminal error I receive is
"node plugin failed to load because environment is not Node.js"
I tried adding
hasCache: {
"host-node": 1, // Ensure we "force" the loader into Node.js mode
"dom": 0 // Ensure that none of the code assumes we have a DOM
},
configuration to my intern.js config file but no success.
Can anyone please suggest a way to configure intern for node-only apps using dojo.
Thanks

How to disable in the node debugger "break on first line"

Is there a command line argument or an environment variable that disables the "break on first line" feature of the node debugger?
There are actually two debugger concepts in node: V8 debugger (with its TCP-based protocol) and a node command-line debugger (CLI).
When you run node debug app.js, a debugger CLI is run in the master node process and a new child node process is spawned for the debugged script (node --debug-brk app.js). The option --debug or --debug-brk is used to turn on V8 debugger in the child process.
The difference between --debug and --debug-brk is that the latter one adds a breakpoint on the first line, so that execution immediately stops there.
I would suggest you this solution:
When you are creating a child process from your webserver, run node --debug instead of node debug. This way there is only one child process created, it is running your application and it is not paused on the first line.
Now you can use any debugging tool that supports V8 debugger protocol - node built-in CLI debugger, node-inspector or you can event implement your own debugger front-end (GUI) if you like. (I presume this is what you are trying achieve by running CLI debugger in background?)
If you decided to use built-in CLI, just spawn another another child process and tell node CLI debugger to connect to the process started in step 1:
node debug localhost:5858
and continue as before.
According this issue I have opened in the node repo, currently, this is not possible. This is also something that the node guys don't see as a feature worth implementing "because it seems kind of pointless. […] Attaching to a running process does exactly" the same thing. See the rest of the discussion in the mentioned issue.
If you think you want such a feature, vote this up, leave a comment in the Github issue, and, if no response, open a new one and post it here as well.
Found this while looking for the answer myself - Seems that you can simply run
node-debug --debug-brk=0 (progname)
Hope this helps someone.
Write a chrome extension to click the start button
1. Run shell
mkdir run_as_devtools
cd run_as_devtools
touch manifest.json
touch run_as_devtools.js
2. Edit the files
run_as_devtools.js:
if (location.protocol === 'chrome-devtools:' && location.href.match(/ws=localhost/))(function () {
'use strict';
setTimeout(function () {
try {
document.querySelector('html /deep/ .long-click-glyph').click();
} catch (e) {
console.log(e);
}
}, 500);
})();
manifest.json: (it uses chromevox's key, so don't use it with chromevox)
{
"content_scripts": [{
"js": [ "run_as_devtools.js" ],
"matches": [ "<all_urls>" ]
}],
"key": "MIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQDEGBi/oD7Yl/Y16w3+gee/95/EUpRZ2U6c+8orV5ei+3CRsBsoXI/DPGBauZ3rWQ47aQnfoG00sXigFdJA2NhNK9OgmRA2evnsRRbjYm2BG1twpaLsgQPPus3PyczbDCvhFu8k24wzFyEtxLrfxAGBseBPb9QrCz7B4k2QgxD/CwIDAQAB",
"manifest_version": 2,
"name": "Elevated Devtools extension",
"version": "1.0"
}
3. Install the extension
Chrome settings - More tools - Extensions- Developer mode - Load unpacked extension - select run_as_devtools folder
P.S. Better to use it with Node inspector manager https://stackoverflow.com/a/43018133/4831179
Reference: https://stackoverflow.com/a/17044405/4831179
I solved same issue just by switching from node v6 to v7
Similar to blackmiaool's idea but simpler, with node v8 you can start the script with --inspect. If you have the following code in it, when you open the debug window in Chrome devtools it will take you straight to the debugger point. Additionally this allows you to execute async code by hitting the "continue" button, which allows your code to run before returning you to the repl:
// app_shell.js
var UserModel = require("./some_user_model");
function looper() {
var Tmp = { UserModel: UserModel };
debugger;
setTimeout(looper, 100);
}
looper();
And in a shell script you can do something like:
echo "Click the 'Open dedicated DevTools for Node' link"
python -mwebbrowser about:inspect
node --inspect app_shell.js
See here for more info
This worked for me .
node --inspect index.js
If you haven't install inspector , install it as receommended by node docs:
npm install -g node-inspect

Resources