VSCode debug VueJS breakpoints show unverified breakpoints

< H1 > VSCode debugging VueJS program breakpoints cannot be entered, showing unverified breakpoints < / H1 >

We refer to the official debug VueJS configuration example: https://github.com/Microsoft/.
error screenshot

launch.json is configured as follows

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "chrome",
      "request": "launch",
      "name": "vuejs: chrome",
      "url": "http://localhost:3000",
      "webRoot": "${workspaceFolder}/src",
      "breakOnLoad": true,
      "sourceMaps": true,
      "sourceMapPathOverrides": {
        "webpack:///src/*": "${webRoot}/*"
      }
    }
  ]
}

I don"t know what happened. It"s VSCode"s own bug?. Or is there any configuration that is not set correctly?

Vue.js debug visual-studio-code

Sep.11,2021

Thank you!
I've always used JetBrains products from webstorm to phpstorm to goLand. IDE
vscode has not been used!

We haven't found the answer yet (maybe, we don't need it). Now, the debugging function of vscode is not as important as we thought.
all the time scanning and automatic hot overloading of eslint can avoid many errors in advance, and at present, the debugging function of Google chrome is quite good, which is no weaker than that of vscode itself (here you use cs-f to locate the code through keywords)
finally, for the fast running of js files, we personally recommend WYSIWYG in the real js field of quokkajs,. Js snippets are very useful for quick testing

Previous: How does Linux mount the folder of the specified server

Next: How does Mini Program judge the added style?