Breakpoints and debug statements open "read-only embedded content"

Context:

I am working on a React.js application that uses Webpack, and I use VS Code as my editor.

Webpack configuration points inline-source-mapas a parameter devtool. but I also use hot reboot. Thus, the source maps actually enter the browser through this protocol webpack://.

I am using the following launch.jsonconfig:

{
    "name": "Launch in Chrome",
    "type": "chrome",
    "request": "launch",
    "url" : "https://myapp.local/", // This is not the real app URL
    "trace" : true,
    "sourceMaps": true,
    "webRoot": "${workspaceRoot}/build",
    "sourceMapPathOverrides": {
        "webpack:///*" : "${webRoot}/*"
    },
    "preLaunchTask" : "development",
    "internalConsoleOptions": "openOnSessionStart",
    "smartStep": true,
    "skipFiles": [
        "node_modules/**",
        "extensions:"
    ]
}

and i use this onetasks.json .


Problem

So this basically works well, unless I place a breakpoint somewhere, it opens a tab in a new tab, marked as read-only content from the source map :

read-only content from source map only

!

+6

Source: https://habr.com/ru/post/1017120/


All Articles