reactjs - Can't set breakpoints on NPM Link'ed library

Question

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.

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?

Answer 1

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