Search code examples
node.jsdebugginggoogle-chrome-devtoolsremote-debugging

NodeJs: Chrome inspector can map source but unable to debug on original source

I have attached chrome inspector to a NodeJS process and see that Chrome can detect the running built source code ( /dist folder ) and also correctly mapped the source code ( /src folder ) to the built source code

However, Whenever I put a debug point in the original source code (/src) , the debugging point is set to the correct line in the built (/dist) version instead and I can only debug the with the built version but not the original source code

The situation can be seen in the picture Did I do something wrong? This is a follow up to the previous question which involve VS Code Debugger, in the case of VS Code, they can not even detect the original source or sourcemap!

enter image description here

Solution

  • This seem to be buggy async sourcemap from babel. We had to upgrade @babel/core from version 7.9.0 to 7.13 and add these 2 parts also into .babelrc

      "presets": [
    [
      "@babel/preset-env",
      {
        "targets": {
          "node": true
        }
      }
    ]
  ],
  "retainLines": true,