Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Can't set breakpoints on NPM Link'ed library

I learn React JavaScript and now I have this problem
I Fork the notistack library in GitHub then download my fork with Git Desktop so the project are on Windows 10 here D:/git/notistack.

After following npm-link doc it all work ok I can debug run the notistack library typescript project in VScode.

I "npm link" on my notistack library and "npm link notistack" in my ReactJs project all standard procedure and I can debug run the library ok. I make changes and rebuild notistack library and I see it's working ok.

But when I set up launch.json like this, with the runtimeArgs, that suppose to enable debugging I can't make breakpoints work in the Library.

{
  "version": "0.2.0",
  "configurations": [
      {
        "name": "Launch Edge",
          "request": "launch",
          "type": "pwa-msedge",
          "url": "https://localhost:6545",
          "webRoot": "${workspaceFolder}",
          "runtimeArgs": [
            "--preserve-symlinks"
        ],
      }
  ]
}

I set breakpoints in the ReactJs project node_module/notistack library but VSCode is setting them as unbound breakpoints.

enter image description here

I suspekt it has something to do with that that notistack library is a Typescript project maybe and I link to a ReactJs project. any idea? Please advice what I need to check and do?

like image 720
Kid Avatar asked Sep 10 '21 18:09

Kid


People also ask

Why are my breakpoints not hitting?

If a source file has changed and the source no longer matches the code you're debugging, the debugger won't set breakpoints in the code by default. Normally, this problem happens when a source file is changed, but the source code wasn't rebuilt. To fix this issue, rebuild the project.

How do I activate breakpoints?

To set a breakpoint in source code, click in the far left margin next to a line of code. You can also select the line and press F9, select Debug > Toggle Breakpoint, or right-click and select Breakpoint > Insert breakpoint.

How do I enable breakpoints in Vscode?

Breakpoints can be toggled by clicking on the editor margin or using F9 on the current line. Finer breakpoint control (enable/disable/reapply) can be done in the Run and Debug view's BREAKPOINTS section.

How do you set breakpoints in a script?

Click Script and then click Edit Script. In Microsoft Visual Studio Tools for Applications (VSTA), locate the line of script on which you want to set a breakpoint, right-click that line, point to Breakpoint, and then click Insert Breakpoint. The breakpoint icon appears on the line of code. On the File menu, click Exit.


Video Answer


1 Answers

I looked this up, and saw some possible fixes,

  • Did you try disabling this setting in VSCode?
"debug.javascript.usePreview": false
  • Try these properties to your launch.json file
{
  "trace": true,
  "sourceMaps": true,
  "webRoot": "${workspaceFolder}/src",
}
  • Restarting VSCode or Downgrading the version

  • Run -> Disable All Breakpoints, then Enable All Breakpoints

like image 66
a.mola Avatar answered Sep 28 '22 05:09

a.mola