vscode-js-debug: Cannot set breakponint in remote development env (create app using create-react-app)

Steps to reproduce:

  1. cd to an empty folder
  2. yarn create react-app . to create a fresh react app
  3. test code:
import './App.css';
import React, { useState } from 'react';

function App() {
  const [date, setDate] = useState(new Date().toString());

  return (
    <div className="App">
      <p>{date}</p>
      <button onClick={() => setDate(new Date().toString())}>now</button>
    </div>
  );
}

export default App;
  1. Set some breakpoints image
  2. ok now create launch.json, all using default config
{
    // Use IntelliSense to learn about possible attributes.
    // Hover to view descriptions of existing attributes.
    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
    "version": "0.2.0",
    "configurations": [
        {
            "type": "chrome",
            "request": "launch",
            "name": "Launch Chrome against localhost",
            "url": "http://<remote_host_ip>:3030",
            "webRoot": "${workspaceFolder}"
        }
    ]
}

I modified the url field to make sure Chrome in local can navigate to target devserver. 6. yarn start to start devserver
7. launch debugger
8. App running perfectly image
but all breakpoints were ignored and debugger show me “breakpoint set but not yet bound” image
image

Output of .scripts command in debugger

› VM21 (/__vscode-remote-uri__/mnt/work/Project/test/reacttest2/VM21)
› VM22 (/__vscode-remote-uri__/mnt/work/Project/test/reacttest2/VM22)
› VM24 (/__vscode-remote-uri__/mnt/work/Project/test/reacttest2/VM24)
› http://192.168.33.110:3000/main.069bf2beeaca19cabfce.hot-update.js (/__vscode-remote-uri__/mnt/work/Project/test/reacttest2/main.069bf2beeaca19cabfce.hot-update.js)
    - /mnt/work/Project/test/reacttest2/src/App.css (/mnt/work/Project/test/reacttest2/src/App.css)
    - webpack:///./src/App.css?498e (/__vscode-remote-uri__/mnt/work/Project/test/reacttest2/src/App.css)
    - /mnt/work/Project/test/reacttest2/src/App.js (/mnt/work/Project/test/reacttest2/src/App.js)
    - /mnt/work/Project/test/reacttest2/src/index.js (/mnt/work/Project/test/reacttest2/src/index.js)
› http://192.168.33.110:3000/static/js/1.chunk.js (/__vscode-remote-uri__/mnt/work/Project/test/reacttest2/static/js/1.chunk.js)
    - /mnt/work/Project/test/reacttest2/node_modules/ansi-styles/index.js (/mnt/work/Project/test/reacttest2/node_modules/ansi-styles/index.js)
    - /mnt/work/Project/test/reacttest2/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/arrayWithHoles.js (/mnt/work/Project/test/reacttest2/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/arrayWithHoles.js)
    - /mnt/work/Project/test/reacttest2/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/arrayWithHoles.js (/mnt/work/Project/test/reacttest2/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/arrayWithHoles.js)
    - /mnt/work/Project/test/reacttest2/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/iterableToArrayLimit.js (/mnt/work/Project/test/reacttest2/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/iterableToArrayLimit.js)
    - /mnt/work/Project/test/reacttest2/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/nonIterableRest.js (/mnt/work/Project/test/reacttest2/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/nonIterableRest.js)
    - /mnt/work/Project/test/reacttest2/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/slicedToArray.js (/mnt/work/Project/test/reacttest2/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/slicedToArray.js)
    - /mnt/work/Project/test/reacttest2/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/iterableToArrayLimit.js (/mnt/work/Project/test/reacttest2/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/iterableToArrayLimit.js)
    - /mnt/work/Project/test/reacttest2/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/nonIterableRest.js (/mnt/work/Project/test/reacttest2/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/nonIterableRest.js)
    - /mnt/work/Project/test/reacttest2/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/slicedToArray.js (/mnt/work/Project/test/reacttest2/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/slicedToArray.js)
    - /mnt/work/Project/test/reacttest2/node_modules/chalk/index.js (/mnt/work/Project/test/reacttest2/node_modules/chalk/index.js)
    - /mnt/work/Project/test/reacttest2/node_modules/chalk/node_modules/supports-color/browser.js (/mnt/work/Project/test/reacttest2/node_modules/chalk/node_modules/supports-color/browser.js)
    - /mnt/work/Project/test/reacttest2/node_modules/chalk/templates.js (/mnt/work/Project/test/reacttest2/node_modules/chalk/templates.js)
    - /mnt/work/Project/test/reacttest2/node_modules/color-convert/conversions.js (/mnt/work/Project/test/reacttest2/node_modules/color-convert/conversions.js)
    - /mnt/work/Project/test/reacttest2/node_modules/color-convert/index.js (/mnt/work/Project/test/reacttest2/node_modules/color-convert/index.js)
    - /mnt/work/Project/test/reacttest2/node_modules/color-convert/route.js (/mnt/work/Project/test/reacttest2/node_modules/color-convert/route.js)
    - /mnt/work/Project/test/reacttest2/node_modules/color-name/index.js (/mnt/work/Project/test/reacttest2/node_modules/color-name/index.js)
    - /mnt/work/Project/test/reacttest2/node_modules/css-loader/dist/runtime/api.js (/mnt/work/Project/test/reacttest2/node_modules/css-loader/dist/runtime/api.js)
    - /mnt/work/Project/test/reacttest2/node_modules/escape-string-regexp/index.js (/mnt/work/Project/test/reacttest2/node_modules/escape-string-regexp/index.js)
    - /mnt/work/Project/test/reacttest2/node_modules/inherits/inherits_browser.js (/mnt/work/Project/test/reacttest2/node_modules/inherits/inherits_browser.js)
    - /mnt/work/Project/test/reacttest2/node_modules/json3/lib/json3.js (/mnt/work/Project/test/reacttest2/node_modules/json3/lib/json3.js)
    - /mnt/work/Project/test/reacttest2/node_modules/ms/index.js (/mnt/work/Project/test/reacttest2/node_modules/ms/index.js)
    - /mnt/work/Project/test/reacttest2/node_modules/node-libs-browser/node_modules/punycode/punycode.js (/mnt/work/Project/test/reacttest2/node_modules/node-libs-browser/node_modules/punycode/punycode.js)
    - /mnt/work/Project/test/reacttest2/node_modules/object-assign/index.js (/mnt/work/Project/test/reacttest2/node_modules/object-assign/index.js)
    - /mnt/work/Project/test/reacttest2/node_modules/process/browser.js (/mnt/work/Project/test/reacttest2/node_modules/process/browser.js)
    - /mnt/work/Project/test/reacttest2/node_modules/prop-types/checkPropTypes.js (/mnt/work/Project/test/reacttest2/node_modules/prop-types/checkPropTypes.js)
    - /mnt/work/Project/test/reacttest2/node_modules/prop-types/lib/ReactPropTypesSecret.js (/mnt/work/Project/test/reacttest2/node_modules/prop-types/lib/ReactPropTypesSecret.js)
    - /mnt/work/Project/test/reacttest2/node_modules/querystring-es3/decode.js (/mnt/work/Project/test/reacttest2/node_modules/querystring-es3/decode.js)
    - /mnt/work/Project/test/reacttest2/node_modules/querystring-es3/encode.js (/mnt/work/Project/test/reacttest2/node_modules/querystring-es3/encode.js)
    - /mnt/work/Project/test/reacttest2/node_modules/querystring-es3/index.js (/mnt/work/Project/test/reacttest2/node_modules/querystring-es3/index.js)
    - /mnt/work/Project/test/reacttest2/node_modules/querystringify/index.js (/mnt/work/Project/test/reacttest2/node_modules/querystringify/index.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/formatWebpackMessages.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/formatWebpackMessages.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/launchEditorEndpoint.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/launchEditorEndpoint.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/debug/src/browser.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/debug/src/browser.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/debug/src/common.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/debug/src/common.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/entry.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/entry.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/event/close.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/event/close.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/event/emitter.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/event/emitter.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/event/event.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/event/event.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/event/eventtarget.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/event/eventtarget.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/event/trans-message.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/event/trans-message.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/facade.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/facade.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/iframe-bootstrap.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/iframe-bootstrap.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/info-ajax.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/info-ajax.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/info-iframe-receiver.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/info-iframe-receiver.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/info-iframe.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/info-iframe.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/info-receiver.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/info-receiver.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/location.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/location.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/main.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/main.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/shims.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/shims.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport-list.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport-list.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/browser/abstract-xhr.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/browser/abstract-xhr.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/browser/eventsource.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/browser/eventsource.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/browser/websocket.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/browser/websocket.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/eventsource.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/eventsource.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/htmlfile.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/htmlfile.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/iframe.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/iframe.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/jsonp-polling.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/jsonp-polling.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/lib/ajax-based.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/lib/ajax-based.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/lib/buffered-sender.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/lib/buffered-sender.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/lib/iframe-wrap.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/lib/iframe-wrap.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/lib/polling.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/lib/polling.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/lib/sender-receiver.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/lib/sender-receiver.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/receiver/eventsource.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/receiver/eventsource.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/receiver/htmlfile.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/receiver/htmlfile.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/receiver/jsonp.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/receiver/jsonp.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/receiver/xhr.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/receiver/xhr.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/sender/jsonp.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/sender/jsonp.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/sender/xdr.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/sender/xdr.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/sender/xhr-cors.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/sender/xhr-cors.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/sender/xhr-fake.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/sender/xhr-fake.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/sender/xhr-local.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/sender/xhr-local.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/websocket.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/websocket.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/xdr-polling.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/xdr-polling.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/xdr-streaming.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/xdr-streaming.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/xhr-polling.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/xhr-polling.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/xhr-streaming.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/transport/xhr-streaming.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/utils/browser-crypto.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/utils/browser-crypto.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/utils/browser.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/utils/browser.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/utils/escape.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/utils/escape.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/utils/event.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/utils/event.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/utils/iframe.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/utils/iframe.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/utils/log.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/utils/log.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/utils/object.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/utils/object.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/utils/random.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/utils/random.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/utils/transport.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/utils/transport.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/utils/url.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/utils/url.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/version.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/node_modules/sockjs-client/lib/version.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/webpackHotDevClient.js (/mnt/work/Project/test/reacttest2/node_modules/react-dev-utils/webpackHotDevClient.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dom/cjs/react-dom.development.js (/mnt/work/Project/test/reacttest2/node_modules/react-dom/cjs/react-dom.development.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-dom/index.js (/mnt/work/Project/test/reacttest2/node_modules/react-dom/index.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react-error-overlay/lib/index.js (/mnt/work/Project/test/reacttest2/node_modules/react-error-overlay/lib/index.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react/cjs/react.development.js (/mnt/work/Project/test/reacttest2/node_modules/react/cjs/react.development.js)
    - /mnt/work/Project/test/reacttest2/node_modules/react/index.js (/mnt/work/Project/test/reacttest2/node_modules/react/index.js)
    - /mnt/work/Project/test/reacttest2/node_modules/requires-port/index.js (/mnt/work/Project/test/reacttest2/node_modules/requires-port/index.js)
    - /mnt/work/Project/test/reacttest2/node_modules/scheduler/cjs/scheduler-tracing.development.js (/mnt/work/Project/test/reacttest2/node_modules/scheduler/cjs/scheduler-tracing.development.js)
    - /mnt/work/Project/test/reacttest2/node_modules/scheduler/cjs/scheduler.development.js (/mnt/work/Project/test/reacttest2/node_modules/scheduler/cjs/scheduler.development.js)
    - /mnt/work/Project/test/reacttest2/node_modules/scheduler/index.js (/mnt/work/Project/test/reacttest2/node_modules/scheduler/index.js)
    - /mnt/work/Project/test/reacttest2/node_modules/scheduler/tracing.js (/mnt/work/Project/test/reacttest2/node_modules/scheduler/tracing.js)
    - /mnt/work/Project/test/reacttest2/node_modules/strip-ansi/index.js (/mnt/work/Project/test/reacttest2/node_modules/strip-ansi/index.js)
    - /mnt/work/Project/test/reacttest2/node_modules/strip-ansi/node_modules/ansi-regex/index.js (/mnt/work/Project/test/reacttest2/node_modules/strip-ansi/node_modules/ansi-regex/index.js)
    - /mnt/work/Project/test/reacttest2/node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js (/mnt/work/Project/test/reacttest2/node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js)
    - /mnt/work/Project/test/reacttest2/node_modules/url-parse/index.js (/mnt/work/Project/test/reacttest2/node_modules/url-parse/index.js)
    - /mnt/work/Project/test/reacttest2/node_modules/url/url.js (/mnt/work/Project/test/reacttest2/node_modules/url/url.js)
    - /mnt/work/Project/test/reacttest2/node_modules/url/util.js (/mnt/work/Project/test/reacttest2/node_modules/url/util.js)
    - /mnt/work/Project/test/reacttest2/node_modules/webpack/buildin/amd-options.js (/mnt/work/Project/test/reacttest2/node_modules/webpack/buildin/amd-options.js)
    - /mnt/work/Project/test/reacttest2/node_modules/webpack/buildin/global.js (/mnt/work/Project/test/reacttest2/node_modules/webpack/buildin/global.js)
    - /mnt/work/Project/test/reacttest2/node_modules/webpack/buildin/module.js (/mnt/work/Project/test/reacttest2/node_modules/webpack/buildin/module.js)
› http://192.168.33.110:3000/static/js/bundle.js (/__vscode-remote-uri__/mnt/work/Project/test/reacttest2/static/js/bundle.js)
    - /mnt/work/Project/test/reacttest2/webpack/bootstrap (/mnt/work/Project/test/reacttest2/webpack/bootstrap)
› http://192.168.33.110:3000/static/js/main.chunk.js (/__vscode-remote-uri__/mnt/work/Project/test/reacttest2/static/js/main.chunk.js)
    - /mnt/work/Project/test/reacttest2/src/App.css (/mnt/work/Project/test/reacttest2/src/App.css)
    - /mnt/work/Project/test/reacttest2/src/index.css (/mnt/work/Project/test/reacttest2/src/index.css)
    - webpack:///./src/App.css?498e (/__vscode-remote-uri__/mnt/work/Project/test/reacttest2/src/App.css)
    - /mnt/work/Project/test/reacttest2/src/App.js (/mnt/work/Project/test/reacttest2/src/App.js)
    - webpack:///./src/index.css?e32c (/__vscode-remote-uri__/mnt/work/Project/test/reacttest2/src/index.css)
    - /mnt/work/Project/test/reacttest2/src/index.js (/mnt/work/Project/test/reacttest2/src/index.js)
    - /mnt/work/Project/test/reacttest2/src/serviceWorker.js (/mnt/work/Project/test/reacttest2/src/serviceWorker.js)

Workspace Path: /mnt/work/Project/test/reacttest2

About this issue

  • Original URL
  • State: closed
  • Created 5 years ago
  • Reactions: 2
  • Comments: 21 (7 by maintainers)

Most upvoted comments

@tosinek it seems that your files are on windows directories. I tried using the direct path to my folder to no avail.

      {
           "type": "chrome",
           "request": "launch",
           "name": "Launch Chrome against localhost",
           "url": "http://localhost:3000",
           "webRoot": "${workspaceFolder}/src",
           "sourceMapPathOverrides": {
               "/home/dev/test-breakpoing/*": "${webRoot}/*",
           }
       }

Here’s a portiong of my .scripts output

› http://localhost:3000/static/js/bundle.js (/__vscode-remote-uri__/home/dev/test-breakpoing/src/static/js/bundle.js)
    - /home/dev/test-breakpoing/webpack/bootstrap (/__vscode-remote-uri__/home/dev/test-breakpoing/src/webpack/bootstrap)
› http://localhost:3000/static/js/main.chunk.js (/__vscode-remote-uri__/home/dev/test-breakpoing/src/static/js/main.chunk.js)
    - /home/dev/test-breakpoing/src/App.css (/__vscode-remote-uri__/home/dev/test-breakpoing/src/src/App.css)
    - /home/dev/test-breakpoing/src/index.css (/__vscode-remote-uri__/home/dev/test-breakpoing/src/src/index.css)
    - webpack:///./src/App.css?498e (/__vscode-remote-uri__/home/dev/test-breakpoing/src/static/js/webpack:/src/App.css)
    - /home/dev/test-breakpoing/src/App.tsx (/__vscode-remote-uri__/home/dev/test-breakpoing/src/src/App.tsx)
    - webpack:///./src/index.css?e32c (/__vscode-remote-uri__/home/dev/test-breakpoing/src/static/js/webpack:/src/index.css)
    - /home/dev/test-breakpoing/src/index.tsx (/__vscode-remote-uri__/home/dev/test-breakpoing/src/src/index.tsx)
    - /home/dev/test-breakpoing/src/logo.svg (/__vscode-remote-uri__/home/dev/test-breakpoing/src/src/logo.svg)
    - /home/dev/test-breakpoing/src/serviceWorker.ts (/__vscode-remote-uri__/home/dev/test-breakpoing/src/src/serviceWorker.ts)

Have you tried removing src from the webpath? Also, could you try the attach option instead of launch?

I tried removing the src from webpath and have not tried doing the attach option.

However

I’ve found a fix. If I use the default launch config:

        {
            "type": "chrome",
            "request": "launch",
            "name": "Launch Chrome against localhost",
            "url": "http://localhost:3000",
            "webRoot": "${workspaceFolder}",
            "sourceMapPathOverrides": {
                "/home/dev/test-breakpoing/*": "${webRoot}/*",
            }
        }

And then modify the settings.json and force chrome extension to be ran on the workspace it works!

    "remote.extensionKind": {
        "msjsdiag.debugger-for-chrome": [
            "workspace"
        ]
    },

image

+3
flipch on Jan 6, 2020

@roblourens What should we do then? Following Create-React-App’s guidance our launch.json should look like

{
            "type": "chrome",
            "request": "launch",
            "name": "Launch Chrome against localhost",
            "url": "http://localhost:3000",
            "webRoot": "${workspaceFolder}/src",
            "sourceMapPathOverrides": {
                "webpack:///src/*": "${webRoot}/*",
            }
        }

Is this not correct for those running in remote, or wsl, environments?

Here’s a log with more info https://gist.github.com/kwskii/db15a36c59f015ac0922d7a0e0c4e43f

+1
flipch on Jan 3, 2020
Read more comments on GitHub
← vscode-js-debug: Cannot find module bootloader.js
vscode-js-debug: Can't debug web (eg ReactJS project) by Microsoft Edge or Chrome →