使用 VSCODE 进行调试在 Webpack + Typescript + 无框架中不起作用
Debugging with VSCODE not working in a Webpack + Typescript + no-framework
背景
在此项目中尝试将 vscode 调试器转换为 运行 浪费了时间。使用：
- Webpack
- 打字稿
- 没有外部库
想法是生成一个兼容ie11的纯vanilla JS组件。这是实际操作：
Link 举个例子：https://gilsoncav.github.io/emails-tags-input/dist/index.html
Link 到回购：https://github.com/gilsoncav/emails-tags-input
问题
我在开发过程中使用 Live Server 扩展进行测试（但我怀疑这个问题与它有任何关系）。
当我尝试启动调试会话时，断点不是 "mounted"。
相关数据
我的package.json相关部分
"scripts": {
"dev": "webpack --mode development --watch",
"build": "webpack --mode production"
},
我的webpack.config.js文件：
const nodeExternals = require('webpack-node-externals');
const path = require('path');
module.exports = {
target: 'web',
externals: [nodeExternals()],
entry: './src/emails-input.ts',
output: {
filename: 'emails-input.js',
// Setting webpack to generate the library with a global variable as
// the spec of the test is suggesting
library: 'EmailsInput',
libraryTarget: 'var',
libraryExport: 'default',
globalObject: 'this',
},
devtool: 'inline-source-map',
devServer: {
contentBase: path.resolve(__dirname, 'dist'),
},
module: {
rules: [
{
test: /\.ts$/,
use: 'ts-loader',
exclude: '/node_modules/',
},
{
test: /\.scss$/,
use: ['style-loader', 'css-loader', 'sass-loader'],
},
],
},
resolve: {
extensions: ['.ts', '.js'],
},
};
我的.vscode/launch.json:
"version": "0.2.0",
"configurations": [
{
"type": "chrome",
"request": "launch",
"name": "chrome",
"url": "http://127.0.0.1:5500/dist/emails-input__form-example.html",
"webRoot": "${workspaceFolder}/dist",
"sourceMaps": true,
"trace": "verbose",
"sourceMapPathOverrides": {
"webpack:///./*": "${workspaceFolder}/src/*",
"webpack:///src/*": "${workspaceFolder}/src/*"
}
}
调试控制台转储：
ECONNREFUSED 127.0.0.1:9222
[17:04:48.761 UTC] HTTP GET failed: Error: connect ECONNREFUSED 127.0.0.1:9222
[17:04:48.761 UTC] Discovering targets via http://127.0.0.1:9222/json
[17:04:48.761 UTC] HTTP GET failed: Error: connect ECONNREFUSED 127.0.0.1:9222
[17:04:48.962 UTC] Getting browser and debug protocol version via http://127.0.0.1:9222/json/version
[17:04:48.963 UTC] Discovering targets via http://127.0.0.1:9222/json/list
[17:04:50.349 UTC] Got browser version: Chrome/81.0.4044.138
[17:04:50.349 UTC] Got debug protocol version: 1.3
[17:04:50.350 UTC] To client: {"seq":0,"type":"event","event":"output","body":{"category":"telemetry","output":"targetDebugProtocolVersion","data":{"Versions.DebugAdapterCore":"6.8.9","Versions.DebugAdapter":"4.12.7"}}}
[17:04:50.350 UTC] To client: {"seq":0,"type":"event","event":"output","body":{"category":"telemetry","output":"targetCount","data":{"Versions.DebugAdapterCore":"6.8.9","Versions.DebugAdapter":"4.12.7","numTargets":1}}}
[17:04:50.351 UTC] Attaching to target: {"description":"","devtoolsFrontendUrl":"/devtools/inspector.html?ws=localhost/devtools/page/064DC8B5E5403FED12A152F9A42B4893","id":"064DC8B5E5403FED12A152F9A42B4893","title":"","type":"page","url":"about:blank","webSocketDebuggerUrl":"ws://127.0.0.1:9222/devtools/page/064DC8B5E5403FED12A152F9A42B4893","version":{}}
[17:04:50.351 UTC] WebSocket Url: ws://127.0.0.1:9222/devtools/page/064DC8B5E5403FED12A152F9A42B4893
[17:04:50.372 UTC] → To target: "{\"id\":1,\"method\":\"Console.enable\"}"
[17:04:50.372 UTC] → To target: "{\"id\":2,\"method\":\"Debugger.enable\"}"
[17:04:50.372 UTC] → To target: "{\"id\":3,\"method\":\"Runtime.enable\"}"
[17:04:50.373 UTC] → To target: "{\"id\":4,\"method\":\"Log.enable\"}"
[17:04:50.373 UTC] → To target: "{\"id\":5,\"method\":\"Runtime.runIfWaitingForDebugger\"}"
[17:04:50.373 UTC] → To target: "{\"id\":6,\"method\":\"Runtime.run\"}"
[17:04:50.373 UTC] → To target: "{\"id\":7,\"method\":\"Page.enable\"}"
[17:04:50.373 UTC] → To target: "{\"id\":8,\"method\":\"Network.enable\",\"params\":{}}"
[17:04:50.450 UTC] ← From target: {"id":1,"result":{}}
[17:04:50.451 UTC] ← From target: {"id":2,"result":{"debuggerId":"-1670810346772519526.-4357034156310313082"}}
[17:04:50.451 UTC] ← From target: {"method":"Runtime.executionContextCreated","params":{"context":{"id":1,"origin":"://","name":"","auxData":{"isDefault":true,"type":"default","frameId":"064DC8B5E5403FED12A152F9A42B4893"}}}}
[17:04:50.452 UTC] ← From target: {"id":3,"result":{}}
[17:04:50.452 UTC] ← From target: {"id":4,"result":{}}
[17:04:50.453 UTC] ← From target: {"id":5,"result":{}}
[17:04:50.455 UTC] ← From target: {"error":{"code":-32601,"message":"'Runtime.run' wasn't found"},"id":6}
[17:04:50.456 UTC] ← From target: {"id":7,"result":{}}
[17:04:50.456 UTC] ← From target: {"id":8,"result":{}}
[17:04:50.456 UTC] → To target: "{\"id\":9,\"method\":\"Debugger.setBlackboxPatterns\",\"params\":{\"patterns\":[\"^chrome-extension:.*\"]}}"
[17:04:50.457 UTC] → To target: "{\"id\":10,\"method\":\"Schema.getDomains\"}"
[17:04:50.468 UTC] ← From target: {"id":10,"result":{"domains":[{"name":"Inspector","version":"1.2"},{"name":"Memory","version":"1.2"},{"name":"Page","version":"1.2"},{"name":"Emulation","version":"1.2"},{"name":"Security","version":"1.2"},{"name":"Network","version":"1.2"},{"name":"Database","version":"1.2"},{"name":"IndexedDB","version":"1.2"},{"name":"CacheStorage","version":"1.2"},{"name":"DOMStorage","version":"1.2"},{"name":"CSS","version":"1.2"},{"name":"ApplicationCache","version":"1.2"},{"name":"DOM","version":"1.2"},{"name":"IO","version":"1.2"},{"name":"DOMDebugger","version":"1.2"},{"name":"DOMSnapshot","version":"1.2"},{"name":"ServiceWorker","version":"1.2"},{"name":"Input","version":"1.2"},{"name":"LayerTree","version":"1.2"},{"name":"DeviceOrientation","version":"1.2"},{"name":"Tracing","version":"1.2"},{"name":"Animation","version":"1.2"},{"name":"Accessibility","version":"1.2"},{"name":"Storage","version":"1.2"},{"name":"Log","version":"1.2"},{"name":"Runtime","version":"1.2"},{"name":"Debugger","version":"1.2"},{"name":"Profiler","version":"1.2"},{"name":"HeapProfiler","version":"1.2"},{"name":"Schema","version":"1.2"},{"name":"Target","version":"1.2"},{"name":"Overlay","version":"1.2"},{"name":"Performance","version":"1.2"},{"name":"Audits","version":"1.2"},{"name":"HeadlessExperimental","version":"1.2"}]}}
[17:04:50.469 UTC] → To target: "{\"id\":11,\"method\":\"Debugger.setAsyncCallStackDepth\",\"params\":{\"maxDepth\":4}}"
[17:04:50.472 UTC] ← From target: {"id":9,"result":{}}
[17:04:50.475 UTC] ← From target: {"id":11,"result":{}}
[17:04:50.476 UTC] → To target: "{\"id\":12,\"method\":\"Runtime.evaluate\",\"params\":{\"expression\":\"navigator.userAgent\",\"silent\":true}}"
[17:04:50.477 UTC] → To target: "{\"id\":13,\"method\":\"Browser.getVersion\"}"
[17:04:50.477 UTC] To client: {"seq":0,"type":"response","request_seq":2,"command":"launch","success":true}
[17:04:50.477 UTC] To client: {"seq":0,"type":"event","event":"output","body":{"category":"telemetry","output":"ClientRequest/launch","data":{"Versions.DebugAdapterCore":"6.8.9","Versions.DebugAdapter":"4.12.7","successful":"true","timeTakenInMilliseconds":"2351.187907","requestType":"request"}}}
[17:04:50.482 UTC] ← From target: {"id":13,"result":{"protocolVersion":"1.3","product":"Chrome/81.0.4044.138","revision":"@8c6c7ba89cc9453625af54f11fd83179e23450fa","userAgent":"Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/81.0.4044.138 Safari/537.36","jsVersion":"8.1.307.32"}}
[17:04:50.483 UTC] To client: {"seq":0,"type":"event","event":"output","body":{"category":"telemetry","output":"target-version","data":{"Versions.DebugAdapterCore":"6.8.9","Versions.DebugAdapter":"4.12.7","Versions.Target.CRDPVersion":"1.3","Versions.Target.Revision":"@8c6c7ba89cc9453625af54f11fd83179e23450fa","Versions.Target.UserAgent":"Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/81.0.4044.138 Safari/537.36","Versions.Target.V8":"8.1.307.32","Versions.Target.Project":"Chrome","Versions.Target.Version":"81.0.4044.138"}}}
[17:04:50.487 UTC] ← From target: {"method":"Debugger.scriptParsed","params":{"scriptId":"5","url":"","startLine":0,"startColumn":0,"endLine":0,"endColumn":19,"executionContextId":1,"hash":"3a6f8cb8708878331cc2be2ec90de0ab25738855","executionContextAuxData":{"isDefault":true,"type":"default","frameId":"064DC8B5E5403FED12A152F9A42B4893"},"isLiveEdit":false,"sourceMapURL":"","hasSourceURL":false,"isModule":false,"length":19}}
[17:04:50.492 UTC] → To target: "{\"id\":14,\"method\":\"Debugger.getPossibleBreakpoints\",\"params\":{\"start\":{\"scriptId\":\"5\",\"lineNumber\":0,\"columnNumber\":0},\"end\":{\"scriptId\":\"5\",\"lineNumber\":1,\"columnNumber\":0},\"restrictToFunction\":false}}"
[17:04:50.496 UTC] ← From target: {"id":12,"result":{"result":{"type":"string","value":"Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/81.0.4044.138 Safari/537.36"}}}
[17:04:50.496 UTC] Target userAgent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/81.0.4044.138 Safari/537.36
[17:04:50.496 UTC] → To target: "{\"id\":15,\"method\":\"Network.setCacheDisabled\",\"params\":{\"cacheDisabled\":true}}"
[17:04:50.499 UTC] ← From target: {"id":14,"result":{"locations":[{"scriptId":"5","lineNumber":0,"columnNumber":0}]}}
[17:04:50.499 UTC] To client: {"seq":0,"type":"event","event":"initialized"}
[17:04:50.502 UTC] To client: {"seq":0,"type":"event","event":"loadedSource","body":{"reason":"new","source":{"name":"VM5","path":"<eval>/VM5","sourceReference":1000}}}
[17:04:50.503 UTC] ← From target: {"id":15,"result":{}}
[17:04:50.710 UTC] From client: loadedSources(undefined)
[17:04:50.711 UTC] To client: {"seq":0,"type":"response","request_seq":3,"command":"loadedSources","success":true,"body":{"sources":[{"name":"VM5","path":"<eval>/VM5","sourceReference":1000}]}}
[17:04:50.711 UTC] To client: {"seq":0,"type":"event","event":"output","body":{"category":"telemetry","output":"ClientRequest/loadedSources","data":{"Versions.DebugAdapterCore":"6.8.9","Versions.DebugAdapter":"4.12.7","Versions.Target.CRDPVersion":"1.3","Versions.Target.Revision":"@8c6c7ba89cc9453625af54f11fd83179e23450fa","Versions.Target.UserAgent":"Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/81.0.4044.138 Safari/537.36","Versions.Target.V8":"8.1.307.32","Versions.Target.Project":"Chrome","Versions.Target.Version":"81.0.4044.138","successful":"true","timeTakenInMilliseconds":"1.048825","requestType":"request"}}}
[17:04:50.795 UTC] From client: setBreakpoints({"source":{"name":"emails-input.ts","path":"/Users/gilsoncav/dev-js/emails-tags-input/src/emails-input.ts"},"lines":[29],"breakpoints":[{"line":29}],"sourceModified":false})
[17:04:50.796 UTC] To client: {"seq":0,"type":"event","event":"output","body":{"category":"telemetry","output":"setBreakpointsRequest","data":{"Versions.DebugAdapterCore":"6.8.9","Versions.DebugAdapter":"4.12.7","Versions.Target.CRDPVersion":"1.3","Versions.Target.Revision":"@8c6c7ba89cc9453625af54f11fd83179e23450fa","Versions.Target.UserAgent":"Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/81.0.4044.138 Safari/537.36","Versions.Target.V8":"8.1.307.32","Versions.Target.Project":"Chrome","Versions.Target.Version":"81.0.4044.138","fileExt":".ts"}}}
[17:04:50.796 UTC] From client: breakpointLocations({"source":{"name":"emails-input.ts","path":"/Users/gilsoncav/dev-js/emails-tags-input/src/emails-input.ts"},"line":29})
[17:04:50.797 UTC] SourceMaps.setBP: /Users/gilsoncav/dev-js/emails-tags-input/src/emails-input.ts can't be resolved to a loaded script. It may just not be loaded yet.
[17:04:50.798 UTC] Paths.setBP: No target url cached yet for client path: /Users/gilsoncav/dev-js/emails-tags-input/src/emails-input.ts.
[17:04:50.799 UTC] SourceMaps.setBP: /Users/gilsoncav/dev-js/emails-tags-input/src/emails-input.ts can't be resolved to a loaded script. It may just not be loaded yet.
[17:04:50.800 UTC] SourceMaps.setBP: /Users/gilsoncav/dev-js/emails-tags-input/src/emails-input.ts can't be resolved to a loaded script. It may just not be loaded yet.
[17:04:50.800 UTC] Paths.setBP: No target url cached yet for client path: /Users/gilsoncav/dev-js/emails-tags-input/src/emails-input.ts.
[17:04:50.800 UTC] → To target: "{\"id\":16,\"method\":\"DOMDebugger.setInstrumentationBreakpoint\",\"params\":{\"eventName\":\"scriptFirstStatement\"}}"
[17:04:50.800 UTC] To client: {"seq":0,"type":"response","request_seq":5,"command":"breakpointLocations","success":true,"body":null}
[17:04:50.801 UTC] To client: {"seq":0,"type":"event","event":"output","body":{"category":"telemetry","output":"ClientRequest/breakpointLocations","data":{"Versions.DebugAdapterCore":"6.8.9","Versions.DebugAdapter":"4.12.7","Versions.Target.CRDPVersion":"1.3","Versions.Target.Revision":"@8c6c7ba89cc9453625af54f11fd83179e23450fa","Versions.Target.UserAgent":"Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/81.0.4044.138 Safari/537.36","Versions.Target.V8":"8.1.307.32","Versions.Target.Project":"Chrome","Versions.Target.Version":"81.0.4044.138","successful":"true","timeTakenInMilliseconds":"4.292901","requestType":"request"}}}
[17:04:50.801 UTC] ← From target: {"id":16,"result":{}}
[17:04:50.802 UTC] To client: {"seq":0,"type":"response","request_seq":4,"command":"setBreakpoints","success":true,"body":{"breakpoints":[{"id":1000,"verified":false,"message":"Breakpoint set but not yet bound"}]}}
[17:04:50.802 UTC] To client: {"seq":0,"type":"event","event":"output","body":{"category":"telemetry","output":"ClientRequest/setBreakpoints","data":{"Versions.DebugAdapterCore":"6.8.9","Versions.DebugAdapter":"4.12.7","Versions.Target.CRDPVersion":"1.3","Versions.Target.Revision":"@8c6c7ba89cc9453625af54f11fd83179e23450fa","Versions.Target.UserAgent":"Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/81.0.4044.138 Safari/537.36","Versions.Target.V8":"8.1.307.32","Versions.Target.Project":"Chrome","Versions.Target.Version":"81.0.4044.138","successful":"true","timeTakenInMilliseconds":"6.538855","requestType":"request"}}}
[17:04:50.845 UTC] From client: setExceptionBreakpoints({"filters":[]})
[17:04:50.845 UTC] → To target: "{\"id\":17,\"method\":\"Debugger.setPauseOnExceptions\",\"params\":{\"state\":\"none\"}}"
[17:04:50.846 UTC] ← From target: {"id":17,"result":{}}
[17:04:50.846 UTC] To client: {"seq":0,"type":"response","request_seq":6,"command":"setExceptionBreakpoints","success":true}
[17:04:50.846 UTC] To client: {"seq":0,"type":"event","event":"output","body":{"category":"telemetry","output":"ClientRequest/setExceptionBreakpoints","data":{"Versions.DebugAdapterCore":"6.8.9","Versions.DebugAdapter":"4.12.7","Versions.Target.CRDPVersion":"1.3","Versions.Target.Revision":"@8c6c7ba89cc9453625af54f11fd83179e23450fa","Versions.Target.UserAgent":"Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/81.0.4044.138 Safari/537.36","Versions.Target.V8":"8.1.307.32","Versions.Target.Project":"Chrome","Versions.Target.Version":"81.0.4044.138","successful":"true","timeTakenInMilliseconds":"1.558665","requestType":"request"}}}
[17:04:50.850 UTC] From client: configurationDone(undefined)
[17:04:50.850 UTC] → To target: "{\"id\":18,\"method\":\"Page.navigate\",\"params\":{\"url\":\"http://127.0.0.1:5500/dist/emails-input__form-example.html\"}}"
[17:04:50.850 UTC] To client: {"seq":0,"type":"response","request_seq":7,"command":"configurationDone","success":true}
[17:04:50.850 UTC] To client: {"seq":0,"type":"event","event":"output","body":{"category":"telemetry","output":"ClientRequest/configurationDone","data":{"Versions.DebugAdapterCore":"6.8.9","Versions.DebugAdapter":"4.12.7","Versions.Target.CRDPVersion":"1.3","Versions.Target.Revision":"@8c6c7ba89cc9453625af54f11fd83179e23450fa","Versions.Target.UserAgent":"Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/81.0.4044.138 Safari/537.36","Versions.Target.V8":"8.1.307.32","Versions.Target.Project":"Chrome","Versions.Target.Version":"81.0.4044.138","successful":"true","timeTakenInMilliseconds":"0.644701","requestType":"request"}}}
[17:04:50.854 UTC] From client: threads(undefined)
[17:04:50.855 UTC] To client: {"seq":0,"type":"response","request_seq":8,"command":"threads","success":true,"body":{"threads":[{"id":1,"name":"Chrome"}]}}
[17:04:50.855 UTC] To client: {"seq":0,"type":"event","event":"output","body":{"category":"telemetry","output":"ClientRequest/threads","data":{"Versions.DebugAdapterCore":"6.8.9","Versions.DebugAdapter":"4.12.7","Versions.Target.CRDPVersion":"1.3","Versions.Target.Revision":"@8c6c7ba89cc9453625af54f11fd83179e23450fa","Versions.Target.UserAgent":"Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/81.0.4044.138 Safari/537.36","Versions.Target.V8":"8.1.307.32","Versions.Target.Project":"Chrome","Versions.Target.Version":"81.0.4044.138","successful":"true","timeTakenInMilliseconds":"1.028673","requestType":"request"}}}
[17:04:50.863 UTC] ← From target: {"id":18,"result":{"frameId":"064DC8B5E5403FED12A152F9A42B4893","loaderId":"090E0F5CAC0AA9179D62839E3FBF8020"}}
[17:04:50.868 UTC] From client: breakpointLocations({"source":{"name":"emails-input.ts","path":"/Users/gilsoncav/dev-js/emails-tags-input/src/emails-input.ts"},"line":29})
[17:04:50.868 UTC] SourceMaps.setBP: /Users/gilsoncav/dev-js/emails-tags-input/src/emails-input.ts can't be resolved to a loaded script. It may just not be loaded yet.
[17:04:50.868 UTC] SourceMaps.setBP: /Users/gilsoncav/dev-js/emails-tags-input/src/emails-input.ts can't be resolved to a loaded script. It may just not be loaded yet.
[17:04:50.869 UTC] Paths.setBP: No target url cached yet for client path: /Users/gilsoncav/dev-js/emails-tags-input/src/emails-input.ts.
[17:04:50.869 UTC] To client: {"seq":0,"type":"response","request_seq":9,"command":"breakpointLocations","success":true,"body":null}
[17:04:50.869 UTC] To client: {"seq":0,"type":"event","event":"output","body":{"category":"telemetry","output":"ClientRequest/breakpointLocations","data":{"Versions.DebugAdapterCore":"6.8.9","Versions.DebugAdapter":"4.12.7","Versions.Target.CRDPVersion":"1.3","Versions.Target.Revision":"@8c6c7ba89cc9453625af54f11fd83179e23450fa","Versions.Target.UserAgent":"Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/81.0.4044.138 Safari/537.36","Versions.Target.V8":"8.1.307.32","Versions.Target.Project":"Chrome","Versions.Target.Version":"81.0.4044.138","successful":"true","timeTakenInMilliseconds":"0.61485","requestType":"request"}}}
[17:04:50.869 UTC] ← From target: {"method":"Page.frameStartedLoading","params":{"frameId":"064DC8B5E5403FED12A152F9A42B4893"}}
[17:04:50.869 UTC] ← From target: {"method":"Runtime.executionContextDestroyed","params":{"executionContextId":1}}
[17:04:50.870 UTC] ← From target: {"method":"Runtime.executionContextsCleared","params":{}}
[17:04:50.871 UTC] To client: {"seq":0,"type":"event","event":"loadedSource","body":{"reason":"removed","source":{"name":"VM5","path":"<eval>/VM5","sourceReference":1000}}}
[17:04:50.871 UTC] ← From target: {"method":"Page.frameNavigated","params":{"frame":{"id":"064DC8B5E5403FED12A152F9A42B4893","loaderId":"090E0F5CAC0AA9179D62839E3FBF8020","url":"http://127.0.0.1:5500/dist/emails-input__form-example.html","securityOrigin":"http://127.0.0.1:5500","mimeType":"text/html"}}}
[17:04:50.872 UTC] To client: {"seq":0,"type":"event","event":"output","body":{"category":"telemetry","output":"report-start-up-timings","data":{"Versions.DebugAdapterCore":"6.8.9","Versions.DebugAdapter":"4.12.7","Versions.Target.CRDPVersion":"1.3","Versions.Target.Revision":"@8c6c7ba89cc9453625af54f11fd83179e23450fa","Versions.Target.UserAgent":"Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/81.0.4044.138 Safari/537.36","Versions.Target.V8":"8.1.307.32","Versions.Target.Project":"Chrome","Versions.Target.Version":"81.0.4044.138","RequestedContentWasDetected":"true","Steps":"[\"BeforeFirstStep\",\"ClientRequest/initialize\",\"ClientRequest/launch\",\"LaunchTarget.LaunchExe\",\"Attach\",\"Attach.RequestDebuggerTargetsInformation\",\"Attach.RequestDebuggerTargetsInformation\",\"Attach.RequestDebuggerTargetsInformation\",\"Attach.RequestDebuggerTargetsInformation\",\"Attach.RequestDebuggerTargetsInformation\",\"Attach.ProcessDebuggerTargetsInformation\",\"Attach.AttachToTargetDebuggerWebsocket\",\"Attach.ConfigureDebuggingSession.Internal\",\"Attach.ConfigureDebuggingSession.Target\",\"Attach.ConfigureDebuggingSession.End\"]","All":"2763.981103","Request.ClientRequest/loadedSources.startTime":"[1589821490710]","Request.ClientRequest/loadedSources.timeTakenInMilliseconds":"[1.048825]","Request.ClientRequest/breakpointLocations.startTime":"[1589821490796,1589821490868]","Request.ClientRequest/breakpointLocations.timeTakenInMilliseconds":"[4.292901,0.61485]","Request.ClientRequest/setBreakpoints.startTime":"[1589821490795]","Request.ClientRequest/setBreakpoints.timeTakenInMilliseconds":"[6.538855]","Request.ClientRequest/setExceptionBreakpoints.startTime":"[1589821490845]","Request.ClientRequest/setExceptionBreakpoints.timeTakenInMilliseconds":"[1.558665]","Request.ClientRequest/configurationDone.startTime":"[1589821490850]","Request.ClientRequest/configurationDone.timeTakenInMilliseconds":"[0.644701]","Request.ClientRequest/threads.startTime":"[1589821490854]","Request.ClientRequest/threads.timeTakenInMilliseconds":"[1.028673]","BeforeFirstStep":"[9.545124]","WaitingAfter.ClientRequest/initialize":"[12.160032]","ClientRequest/initialize":"[8.405613]","ClientRequest/launch":"[3.017412]","LaunchTarget.LaunchExe":"[4.081949]","Attach":"[5.006457]","Attach.RequestDebuggerTargetsInformation":"[213.829774,203.063936,205.105162,202.938851,1387.320519]","Attach.ProcessDebuggerTargetsInformation":"[1.456122]","Attach.AttachToTargetDebuggerWebsocket":"[3.125695]","Attach.ConfigureDebuggingSession.Internal":"[0.431934]","Attach.ConfigureDebuggingSession.Target":"[120.704226]","WaitingAfter.ClientRequest/launch":"[2369.170056]","WaitingAfter.NotifyInitialized":"[2391.895452]","RequestedNavigateToUserPage":"[2755.663593]","Attach.ConfigureDebuggingSession.End":"[395.650265]"}}}
[17:04:50.872 UTC] ← From target: {"method":"Runtime.executionContextCreated","params":{"context":{"id":2,"origin":"http://127.0.0.1:5500","name":"","auxData":{"isDefault":true,"type":"default","frameId":"064DC8B5E5403FED12A152F9A42B4893"}}}}
[17:04:50.873 UTC] ← From target: {"method":"Log.entryAdded","params":{"entry":{"source":"network","level":"error","text":"Failed to load resource: the server responded with a status of 404 (Not Found)","timestamp":1.589821490867167e+12,"url":"http://127.0.0.1:5500/dist/emails-input__form-example.html","networkRequestId":"090E0F5CAC0AA9179D62839E3FBF8020"}}}
[17:04:50.874 UTC] To client: {"seq":0,"type":"event","event":"output","body":{"category":"stderr","output":"Failed to load resource: the server responded with a status of 404 (Not Found) [http://127.0.0.1:5500/dist/emails-input__form-example.html]\n"}}
[17:04:50.992 UTC] ← From target: {"method":"Page.loadEventFired","params":{"timestamp":33991.827034}}
[17:04:50.993 UTC] ← From target: {"method":"Page.frameStoppedLoading","params":{"frameId":"064DC8B5E5403FED12A152F9A42B4893"}}
[17:04:50.993 UTC] ← From target: {"method":"Page.domContentEventFired","params":{"timestamp":33991.925795}}
[17:04:50.998 UTC] ← From target: {"method":"Log.entryAdded","params":{"entry":{"source":"network","level":"error","text":"Failed to load resource: the server responded with a status of 404 (Not Found)","timestamp":1.589821490996633e+12,"url":"http://127.0.0.1:5500/favicon.ico","networkRequestId":"11571.2"}}}
[17:04:50.998 UTC] To client: {"seq":0,"type":"event","event":"output","body":{"category":"stderr","output":"Failed to load resource: the server responded with a status of 404 (Not Found) [http://127.0.0.1:5500/favicon.ico]\n"}}
[17:04:58.109 UTC] To client: {"seq":0,"type":"event","event":"output","body":{"category":"telemetry","output":"target/notification/onScriptParsed","data":{"Versions.DebugAdapterCore":"6.8.9","Versions.DebugAdapter":"4.12.7","Versions.Target.CRDPVersion":"1.3","Versions.Target.Revision":"@8c6c7ba89cc9453625af54f11fd83179e23450fa","Versions.Target.UserAgent":"Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/81.0.4044.138 Safari/537.36","Versions.Target.V8":"8.1.307.32","Versions.Target.Project":"Chrome","Versions.Target.Version":"81.0.4044.138","aggregated.startTime":"[\"1589821490488\"]","aggregated.successful":"[\"true\"]","aggregated.timeTakenInMilliseconds":"[\"6.963062\"]"}}}
在找到 vscode 拒绝附加断点的原因的巨大痛苦之后，我找到了解决它的原因和方法。
好吧，通过 launch.json 设置 "trace": "verboser", 我发现了这个痕迹：
SourceMaps.setBP: /Users/gilsoncav/dev-js/emails-tags-input/src/emails-input.ts can't be resolved to a loaded script. It may just not be loaded yet.
Paths.setBP: No target url cached yet for client path: /Users/gilsoncav/dev-js/emails-tags-input/src/emails-input.ts.
我去 Chrome DevTools 查看 SourceMap 在那里...
请注意，源映射脚本的路径是 webpack://EmailsInput/./...，这就是为什么 launch.json 中的以下传统设置不起作用的原因
"sourceMapPathOverrides": {
"webpack:///./*": "${workspaceFolder}/*"
}
因此，解决方法是将其设置为：
"sourceMapPathOverrides": {
"webpack://EmailsInput/./*": "${workspaceFolder}/*"
}
为什么会有这个该死的EmailsInput？我发现罪魁祸首是我在 webpack.config.js 中使用的 library 设置：
...
output: {
filename: 'emails-input.js',
// Setting webpack to generate the library with a global variable as
// the spec of the test is suggesting
library: 'EmailsInput',
libraryTarget: 'var',
libraryExport: 'default',
globalObject: 'this',
path: path.resolve(__dirname, 'dist'),
},
...
背景
在此项目中尝试将 vscode 调试器转换为 运行 浪费了时间。使用：
- Webpack
- 打字稿
- 没有外部库
想法是生成一个兼容ie11的纯vanilla JS组件。这是实际操作：
Link 举个例子：https://gilsoncav.github.io/emails-tags-input/dist/index.html
Link 到回购：https://github.com/gilsoncav/emails-tags-input
问题
我在开发过程中使用 Live Server 扩展进行测试（但我怀疑这个问题与它有任何关系）。
当我尝试启动调试会话时，断点不是 "mounted"。
相关数据
我的package.json相关部分
"scripts": {
"dev": "webpack --mode development --watch",
"build": "webpack --mode production"
},
我的webpack.config.js文件：
const nodeExternals = require('webpack-node-externals');
const path = require('path');
module.exports = {
target: 'web',
externals: [nodeExternals()],
entry: './src/emails-input.ts',
output: {
filename: 'emails-input.js',
// Setting webpack to generate the library with a global variable as
// the spec of the test is suggesting
library: 'EmailsInput',
libraryTarget: 'var',
libraryExport: 'default',
globalObject: 'this',
},
devtool: 'inline-source-map',
devServer: {
contentBase: path.resolve(__dirname, 'dist'),
},
module: {
rules: [
{
test: /\.ts$/,
use: 'ts-loader',
exclude: '/node_modules/',
},
{
test: /\.scss$/,
use: ['style-loader', 'css-loader', 'sass-loader'],
},
],
},
resolve: {
extensions: ['.ts', '.js'],
},
};
我的.vscode/launch.json:
"version": "0.2.0",
"configurations": [
{
"type": "chrome",
"request": "launch",
"name": "chrome",
"url": "http://127.0.0.1:5500/dist/emails-input__form-example.html",
"webRoot": "${workspaceFolder}/dist",
"sourceMaps": true,
"trace": "verbose",
"sourceMapPathOverrides": {
"webpack:///./*": "${workspaceFolder}/src/*",
"webpack:///src/*": "${workspaceFolder}/src/*"
}
}
调试控制台转储：
ECONNREFUSED 127.0.0.1:9222
[17:04:48.761 UTC] HTTP GET failed: Error: connect ECONNREFUSED 127.0.0.1:9222
[17:04:48.761 UTC] Discovering targets via http://127.0.0.1:9222/json
[17:04:48.761 UTC] HTTP GET failed: Error: connect ECONNREFUSED 127.0.0.1:9222
[17:04:48.962 UTC] Getting browser and debug protocol version via http://127.0.0.1:9222/json/version
[17:04:48.963 UTC] Discovering targets via http://127.0.0.1:9222/json/list
[17:04:50.349 UTC] Got browser version: Chrome/81.0.4044.138
[17:04:50.349 UTC] Got debug protocol version: 1.3
[17:04:50.350 UTC] To client: {"seq":0,"type":"event","event":"output","body":{"category":"telemetry","output":"targetDebugProtocolVersion","data":{"Versions.DebugAdapterCore":"6.8.9","Versions.DebugAdapter":"4.12.7"}}}
[17:04:50.350 UTC] To client: {"seq":0,"type":"event","event":"output","body":{"category":"telemetry","output":"targetCount","data":{"Versions.DebugAdapterCore":"6.8.9","Versions.DebugAdapter":"4.12.7","numTargets":1}}}
[17:04:50.351 UTC] Attaching to target: {"description":"","devtoolsFrontendUrl":"/devtools/inspector.html?ws=localhost/devtools/page/064DC8B5E5403FED12A152F9A42B4893","id":"064DC8B5E5403FED12A152F9A42B4893","title":"","type":"page","url":"about:blank","webSocketDebuggerUrl":"ws://127.0.0.1:9222/devtools/page/064DC8B5E5403FED12A152F9A42B4893","version":{}}
[17:04:50.351 UTC] WebSocket Url: ws://127.0.0.1:9222/devtools/page/064DC8B5E5403FED12A152F9A42B4893
[17:04:50.372 UTC] → To target: "{\"id\":1,\"method\":\"Console.enable\"}"
[17:04:50.372 UTC] → To target: "{\"id\":2,\"method\":\"Debugger.enable\"}"
[17:04:50.372 UTC] → To target: "{\"id\":3,\"method\":\"Runtime.enable\"}"
[17:04:50.373 UTC] → To target: "{\"id\":4,\"method\":\"Log.enable\"}"
[17:04:50.373 UTC] → To target: "{\"id\":5,\"method\":\"Runtime.runIfWaitingForDebugger\"}"
[17:04:50.373 UTC] → To target: "{\"id\":6,\"method\":\"Runtime.run\"}"
[17:04:50.373 UTC] → To target: "{\"id\":7,\"method\":\"Page.enable\"}"
[17:04:50.373 UTC] → To target: "{\"id\":8,\"method\":\"Network.enable\",\"params\":{}}"
[17:04:50.450 UTC] ← From target: {"id":1,"result":{}}
[17:04:50.451 UTC] ← From target: {"id":2,"result":{"debuggerId":"-1670810346772519526.-4357034156310313082"}}
[17:04:50.451 UTC] ← From target: {"method":"Runtime.executionContextCreated","params":{"context":{"id":1,"origin":"://","name":"","auxData":{"isDefault":true,"type":"default","frameId":"064DC8B5E5403FED12A152F9A42B4893"}}}}
[17:04:50.452 UTC] ← From target: {"id":3,"result":{}}
[17:04:50.452 UTC] ← From target: {"id":4,"result":{}}
[17:04:50.453 UTC] ← From target: {"id":5,"result":{}}
[17:04:50.455 UTC] ← From target: {"error":{"code":-32601,"message":"'Runtime.run' wasn't found"},"id":6}
[17:04:50.456 UTC] ← From target: {"id":7,"result":{}}
[17:04:50.456 UTC] ← From target: {"id":8,"result":{}}
[17:04:50.456 UTC] → To target: "{\"id\":9,\"method\":\"Debugger.setBlackboxPatterns\",\"params\":{\"patterns\":[\"^chrome-extension:.*\"]}}"
[17:04:50.457 UTC] → To target: "{\"id\":10,\"method\":\"Schema.getDomains\"}"
[17:04:50.468 UTC] ← From target: {"id":10,"result":{"domains":[{"name":"Inspector","version":"1.2"},{"name":"Memory","version":"1.2"},{"name":"Page","version":"1.2"},{"name":"Emulation","version":"1.2"},{"name":"Security","version":"1.2"},{"name":"Network","version":"1.2"},{"name":"Database","version":"1.2"},{"name":"IndexedDB","version":"1.2"},{"name":"CacheStorage","version":"1.2"},{"name":"DOMStorage","version":"1.2"},{"name":"CSS","version":"1.2"},{"name":"ApplicationCache","version":"1.2"},{"name":"DOM","version":"1.2"},{"name":"IO","version":"1.2"},{"name":"DOMDebugger","version":"1.2"},{"name":"DOMSnapshot","version":"1.2"},{"name":"ServiceWorker","version":"1.2"},{"name":"Input","version":"1.2"},{"name":"LayerTree","version":"1.2"},{"name":"DeviceOrientation","version":"1.2"},{"name":"Tracing","version":"1.2"},{"name":"Animation","version":"1.2"},{"name":"Accessibility","version":"1.2"},{"name":"Storage","version":"1.2"},{"name":"Log","version":"1.2"},{"name":"Runtime","version":"1.2"},{"name":"Debugger","version":"1.2"},{"name":"Profiler","version":"1.2"},{"name":"HeapProfiler","version":"1.2"},{"name":"Schema","version":"1.2"},{"name":"Target","version":"1.2"},{"name":"Overlay","version":"1.2"},{"name":"Performance","version":"1.2"},{"name":"Audits","version":"1.2"},{"name":"HeadlessExperimental","version":"1.2"}]}}
[17:04:50.469 UTC] → To target: "{\"id\":11,\"method\":\"Debugger.setAsyncCallStackDepth\",\"params\":{\"maxDepth\":4}}"
[17:04:50.472 UTC] ← From target: {"id":9,"result":{}}
[17:04:50.475 UTC] ← From target: {"id":11,"result":{}}
[17:04:50.476 UTC] → To target: "{\"id\":12,\"method\":\"Runtime.evaluate\",\"params\":{\"expression\":\"navigator.userAgent\",\"silent\":true}}"
[17:04:50.477 UTC] → To target: "{\"id\":13,\"method\":\"Browser.getVersion\"}"
[17:04:50.477 UTC] To client: {"seq":0,"type":"response","request_seq":2,"command":"launch","success":true}
[17:04:50.477 UTC] To client: {"seq":0,"type":"event","event":"output","body":{"category":"telemetry","output":"ClientRequest/launch","data":{"Versions.DebugAdapterCore":"6.8.9","Versions.DebugAdapter":"4.12.7","successful":"true","timeTakenInMilliseconds":"2351.187907","requestType":"request"}}}
[17:04:50.482 UTC] ← From target: {"id":13,"result":{"protocolVersion":"1.3","product":"Chrome/81.0.4044.138","revision":"@8c6c7ba89cc9453625af54f11fd83179e23450fa","userAgent":"Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/81.0.4044.138 Safari/537.36","jsVersion":"8.1.307.32"}}
[17:04:50.483 UTC] To client: {"seq":0,"type":"event","event":"output","body":{"category":"telemetry","output":"target-version","data":{"Versions.DebugAdapterCore":"6.8.9","Versions.DebugAdapter":"4.12.7","Versions.Target.CRDPVersion":"1.3","Versions.Target.Revision":"@8c6c7ba89cc9453625af54f11fd83179e23450fa","Versions.Target.UserAgent":"Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/81.0.4044.138 Safari/537.36","Versions.Target.V8":"8.1.307.32","Versions.Target.Project":"Chrome","Versions.Target.Version":"81.0.4044.138"}}}
[17:04:50.487 UTC] ← From target: {"method":"Debugger.scriptParsed","params":{"scriptId":"5","url":"","startLine":0,"startColumn":0,"endLine":0,"endColumn":19,"executionContextId":1,"hash":"3a6f8cb8708878331cc2be2ec90de0ab25738855","executionContextAuxData":{"isDefault":true,"type":"default","frameId":"064DC8B5E5403FED12A152F9A42B4893"},"isLiveEdit":false,"sourceMapURL":"","hasSourceURL":false,"isModule":false,"length":19}}
[17:04:50.492 UTC] → To target: "{\"id\":14,\"method\":\"Debugger.getPossibleBreakpoints\",\"params\":{\"start\":{\"scriptId\":\"5\",\"lineNumber\":0,\"columnNumber\":0},\"end\":{\"scriptId\":\"5\",\"lineNumber\":1,\"columnNumber\":0},\"restrictToFunction\":false}}"
[17:04:50.496 UTC] ← From target: {"id":12,"result":{"result":{"type":"string","value":"Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/81.0.4044.138 Safari/537.36"}}}
[17:04:50.496 UTC] Target userAgent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/81.0.4044.138 Safari/537.36
[17:04:50.496 UTC] → To target: "{\"id\":15,\"method\":\"Network.setCacheDisabled\",\"params\":{\"cacheDisabled\":true}}"
[17:04:50.499 UTC] ← From target: {"id":14,"result":{"locations":[{"scriptId":"5","lineNumber":0,"columnNumber":0}]}}
[17:04:50.499 UTC] To client: {"seq":0,"type":"event","event":"initialized"}
[17:04:50.502 UTC] To client: {"seq":0,"type":"event","event":"loadedSource","body":{"reason":"new","source":{"name":"VM5","path":"<eval>/VM5","sourceReference":1000}}}
[17:04:50.503 UTC] ← From target: {"id":15,"result":{}}
[17:04:50.710 UTC] From client: loadedSources(undefined)
[17:04:50.711 UTC] To client: {"seq":0,"type":"response","request_seq":3,"command":"loadedSources","success":true,"body":{"sources":[{"name":"VM5","path":"<eval>/VM5","sourceReference":1000}]}}
[17:04:50.711 UTC] To client: {"seq":0,"type":"event","event":"output","body":{"category":"telemetry","output":"ClientRequest/loadedSources","data":{"Versions.DebugAdapterCore":"6.8.9","Versions.DebugAdapter":"4.12.7","Versions.Target.CRDPVersion":"1.3","Versions.Target.Revision":"@8c6c7ba89cc9453625af54f11fd83179e23450fa","Versions.Target.UserAgent":"Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/81.0.4044.138 Safari/537.36","Versions.Target.V8":"8.1.307.32","Versions.Target.Project":"Chrome","Versions.Target.Version":"81.0.4044.138","successful":"true","timeTakenInMilliseconds":"1.048825","requestType":"request"}}}
[17:04:50.795 UTC] From client: setBreakpoints({"source":{"name":"emails-input.ts","path":"/Users/gilsoncav/dev-js/emails-tags-input/src/emails-input.ts"},"lines":[29],"breakpoints":[{"line":29}],"sourceModified":false})
[17:04:50.796 UTC] To client: {"seq":0,"type":"event","event":"output","body":{"category":"telemetry","output":"setBreakpointsRequest","data":{"Versions.DebugAdapterCore":"6.8.9","Versions.DebugAdapter":"4.12.7","Versions.Target.CRDPVersion":"1.3","Versions.Target.Revision":"@8c6c7ba89cc9453625af54f11fd83179e23450fa","Versions.Target.UserAgent":"Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/81.0.4044.138 Safari/537.36","Versions.Target.V8":"8.1.307.32","Versions.Target.Project":"Chrome","Versions.Target.Version":"81.0.4044.138","fileExt":".ts"}}}
[17:04:50.796 UTC] From client: breakpointLocations({"source":{"name":"emails-input.ts","path":"/Users/gilsoncav/dev-js/emails-tags-input/src/emails-input.ts"},"line":29})
[17:04:50.797 UTC] SourceMaps.setBP: /Users/gilsoncav/dev-js/emails-tags-input/src/emails-input.ts can't be resolved to a loaded script. It may just not be loaded yet.
[17:04:50.798 UTC] Paths.setBP: No target url cached yet for client path: /Users/gilsoncav/dev-js/emails-tags-input/src/emails-input.ts.
[17:04:50.799 UTC] SourceMaps.setBP: /Users/gilsoncav/dev-js/emails-tags-input/src/emails-input.ts can't be resolved to a loaded script. It may just not be loaded yet.
[17:04:50.800 UTC] SourceMaps.setBP: /Users/gilsoncav/dev-js/emails-tags-input/src/emails-input.ts can't be resolved to a loaded script. It may just not be loaded yet.
[17:04:50.800 UTC] Paths.setBP: No target url cached yet for client path: /Users/gilsoncav/dev-js/emails-tags-input/src/emails-input.ts.
[17:04:50.800 UTC] → To target: "{\"id\":16,\"method\":\"DOMDebugger.setInstrumentationBreakpoint\",\"params\":{\"eventName\":\"scriptFirstStatement\"}}"
[17:04:50.800 UTC] To client: {"seq":0,"type":"response","request_seq":5,"command":"breakpointLocations","success":true,"body":null}
[17:04:50.801 UTC] To client: {"seq":0,"type":"event","event":"output","body":{"category":"telemetry","output":"ClientRequest/breakpointLocations","data":{"Versions.DebugAdapterCore":"6.8.9","Versions.DebugAdapter":"4.12.7","Versions.Target.CRDPVersion":"1.3","Versions.Target.Revision":"@8c6c7ba89cc9453625af54f11fd83179e23450fa","Versions.Target.UserAgent":"Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/81.0.4044.138 Safari/537.36","Versions.Target.V8":"8.1.307.32","Versions.Target.Project":"Chrome","Versions.Target.Version":"81.0.4044.138","successful":"true","timeTakenInMilliseconds":"4.292901","requestType":"request"}}}
[17:04:50.801 UTC] ← From target: {"id":16,"result":{}}
[17:04:50.802 UTC] To client: {"seq":0,"type":"response","request_seq":4,"command":"setBreakpoints","success":true,"body":{"breakpoints":[{"id":1000,"verified":false,"message":"Breakpoint set but not yet bound"}]}}
[17:04:50.802 UTC] To client: {"seq":0,"type":"event","event":"output","body":{"category":"telemetry","output":"ClientRequest/setBreakpoints","data":{"Versions.DebugAdapterCore":"6.8.9","Versions.DebugAdapter":"4.12.7","Versions.Target.CRDPVersion":"1.3","Versions.Target.Revision":"@8c6c7ba89cc9453625af54f11fd83179e23450fa","Versions.Target.UserAgent":"Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/81.0.4044.138 Safari/537.36","Versions.Target.V8":"8.1.307.32","Versions.Target.Project":"Chrome","Versions.Target.Version":"81.0.4044.138","successful":"true","timeTakenInMilliseconds":"6.538855","requestType":"request"}}}
[17:04:50.845 UTC] From client: setExceptionBreakpoints({"filters":[]})
[17:04:50.845 UTC] → To target: "{\"id\":17,\"method\":\"Debugger.setPauseOnExceptions\",\"params\":{\"state\":\"none\"}}"
[17:04:50.846 UTC] ← From target: {"id":17,"result":{}}
[17:04:50.846 UTC] To client: {"seq":0,"type":"response","request_seq":6,"command":"setExceptionBreakpoints","success":true}
[17:04:50.846 UTC] To client: {"seq":0,"type":"event","event":"output","body":{"category":"telemetry","output":"ClientRequest/setExceptionBreakpoints","data":{"Versions.DebugAdapterCore":"6.8.9","Versions.DebugAdapter":"4.12.7","Versions.Target.CRDPVersion":"1.3","Versions.Target.Revision":"@8c6c7ba89cc9453625af54f11fd83179e23450fa","Versions.Target.UserAgent":"Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/81.0.4044.138 Safari/537.36","Versions.Target.V8":"8.1.307.32","Versions.Target.Project":"Chrome","Versions.Target.Version":"81.0.4044.138","successful":"true","timeTakenInMilliseconds":"1.558665","requestType":"request"}}}
[17:04:50.850 UTC] From client: configurationDone(undefined)
[17:04:50.850 UTC] → To target: "{\"id\":18,\"method\":\"Page.navigate\",\"params\":{\"url\":\"http://127.0.0.1:5500/dist/emails-input__form-example.html\"}}"
[17:04:50.850 UTC] To client: {"seq":0,"type":"response","request_seq":7,"command":"configurationDone","success":true}
[17:04:50.850 UTC] To client: {"seq":0,"type":"event","event":"output","body":{"category":"telemetry","output":"ClientRequest/configurationDone","data":{"Versions.DebugAdapterCore":"6.8.9","Versions.DebugAdapter":"4.12.7","Versions.Target.CRDPVersion":"1.3","Versions.Target.Revision":"@8c6c7ba89cc9453625af54f11fd83179e23450fa","Versions.Target.UserAgent":"Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/81.0.4044.138 Safari/537.36","Versions.Target.V8":"8.1.307.32","Versions.Target.Project":"Chrome","Versions.Target.Version":"81.0.4044.138","successful":"true","timeTakenInMilliseconds":"0.644701","requestType":"request"}}}
[17:04:50.854 UTC] From client: threads(undefined)
[17:04:50.855 UTC] To client: {"seq":0,"type":"response","request_seq":8,"command":"threads","success":true,"body":{"threads":[{"id":1,"name":"Chrome"}]}}
[17:04:50.855 UTC] To client: {"seq":0,"type":"event","event":"output","body":{"category":"telemetry","output":"ClientRequest/threads","data":{"Versions.DebugAdapterCore":"6.8.9","Versions.DebugAdapter":"4.12.7","Versions.Target.CRDPVersion":"1.3","Versions.Target.Revision":"@8c6c7ba89cc9453625af54f11fd83179e23450fa","Versions.Target.UserAgent":"Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/81.0.4044.138 Safari/537.36","Versions.Target.V8":"8.1.307.32","Versions.Target.Project":"Chrome","Versions.Target.Version":"81.0.4044.138","successful":"true","timeTakenInMilliseconds":"1.028673","requestType":"request"}}}
[17:04:50.863 UTC] ← From target: {"id":18,"result":{"frameId":"064DC8B5E5403FED12A152F9A42B4893","loaderId":"090E0F5CAC0AA9179D62839E3FBF8020"}}
[17:04:50.868 UTC] From client: breakpointLocations({"source":{"name":"emails-input.ts","path":"/Users/gilsoncav/dev-js/emails-tags-input/src/emails-input.ts"},"line":29})
[17:04:50.868 UTC] SourceMaps.setBP: /Users/gilsoncav/dev-js/emails-tags-input/src/emails-input.ts can't be resolved to a loaded script. It may just not be loaded yet.
[17:04:50.868 UTC] SourceMaps.setBP: /Users/gilsoncav/dev-js/emails-tags-input/src/emails-input.ts can't be resolved to a loaded script. It may just not be loaded yet.
[17:04:50.869 UTC] Paths.setBP: No target url cached yet for client path: /Users/gilsoncav/dev-js/emails-tags-input/src/emails-input.ts.
[17:04:50.869 UTC] To client: {"seq":0,"type":"response","request_seq":9,"command":"breakpointLocations","success":true,"body":null}
[17:04:50.869 UTC] To client: {"seq":0,"type":"event","event":"output","body":{"category":"telemetry","output":"ClientRequest/breakpointLocations","data":{"Versions.DebugAdapterCore":"6.8.9","Versions.DebugAdapter":"4.12.7","Versions.Target.CRDPVersion":"1.3","Versions.Target.Revision":"@8c6c7ba89cc9453625af54f11fd83179e23450fa","Versions.Target.UserAgent":"Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/81.0.4044.138 Safari/537.36","Versions.Target.V8":"8.1.307.32","Versions.Target.Project":"Chrome","Versions.Target.Version":"81.0.4044.138","successful":"true","timeTakenInMilliseconds":"0.61485","requestType":"request"}}}
[17:04:50.869 UTC] ← From target: {"method":"Page.frameStartedLoading","params":{"frameId":"064DC8B5E5403FED12A152F9A42B4893"}}
[17:04:50.869 UTC] ← From target: {"method":"Runtime.executionContextDestroyed","params":{"executionContextId":1}}
[17:04:50.870 UTC] ← From target: {"method":"Runtime.executionContextsCleared","params":{}}
[17:04:50.871 UTC] To client: {"seq":0,"type":"event","event":"loadedSource","body":{"reason":"removed","source":{"name":"VM5","path":"<eval>/VM5","sourceReference":1000}}}
[17:04:50.871 UTC] ← From target: {"method":"Page.frameNavigated","params":{"frame":{"id":"064DC8B5E5403FED12A152F9A42B4893","loaderId":"090E0F5CAC0AA9179D62839E3FBF8020","url":"http://127.0.0.1:5500/dist/emails-input__form-example.html","securityOrigin":"http://127.0.0.1:5500","mimeType":"text/html"}}}
[17:04:50.872 UTC] To client: {"seq":0,"type":"event","event":"output","body":{"category":"telemetry","output":"report-start-up-timings","data":{"Versions.DebugAdapterCore":"6.8.9","Versions.DebugAdapter":"4.12.7","Versions.Target.CRDPVersion":"1.3","Versions.Target.Revision":"@8c6c7ba89cc9453625af54f11fd83179e23450fa","Versions.Target.UserAgent":"Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/81.0.4044.138 Safari/537.36","Versions.Target.V8":"8.1.307.32","Versions.Target.Project":"Chrome","Versions.Target.Version":"81.0.4044.138","RequestedContentWasDetected":"true","Steps":"[\"BeforeFirstStep\",\"ClientRequest/initialize\",\"ClientRequest/launch\",\"LaunchTarget.LaunchExe\",\"Attach\",\"Attach.RequestDebuggerTargetsInformation\",\"Attach.RequestDebuggerTargetsInformation\",\"Attach.RequestDebuggerTargetsInformation\",\"Attach.RequestDebuggerTargetsInformation\",\"Attach.RequestDebuggerTargetsInformation\",\"Attach.ProcessDebuggerTargetsInformation\",\"Attach.AttachToTargetDebuggerWebsocket\",\"Attach.ConfigureDebuggingSession.Internal\",\"Attach.ConfigureDebuggingSession.Target\",\"Attach.ConfigureDebuggingSession.End\"]","All":"2763.981103","Request.ClientRequest/loadedSources.startTime":"[1589821490710]","Request.ClientRequest/loadedSources.timeTakenInMilliseconds":"[1.048825]","Request.ClientRequest/breakpointLocations.startTime":"[1589821490796,1589821490868]","Request.ClientRequest/breakpointLocations.timeTakenInMilliseconds":"[4.292901,0.61485]","Request.ClientRequest/setBreakpoints.startTime":"[1589821490795]","Request.ClientRequest/setBreakpoints.timeTakenInMilliseconds":"[6.538855]","Request.ClientRequest/setExceptionBreakpoints.startTime":"[1589821490845]","Request.ClientRequest/setExceptionBreakpoints.timeTakenInMilliseconds":"[1.558665]","Request.ClientRequest/configurationDone.startTime":"[1589821490850]","Request.ClientRequest/configurationDone.timeTakenInMilliseconds":"[0.644701]","Request.ClientRequest/threads.startTime":"[1589821490854]","Request.ClientRequest/threads.timeTakenInMilliseconds":"[1.028673]","BeforeFirstStep":"[9.545124]","WaitingAfter.ClientRequest/initialize":"[12.160032]","ClientRequest/initialize":"[8.405613]","ClientRequest/launch":"[3.017412]","LaunchTarget.LaunchExe":"[4.081949]","Attach":"[5.006457]","Attach.RequestDebuggerTargetsInformation":"[213.829774,203.063936,205.105162,202.938851,1387.320519]","Attach.ProcessDebuggerTargetsInformation":"[1.456122]","Attach.AttachToTargetDebuggerWebsocket":"[3.125695]","Attach.ConfigureDebuggingSession.Internal":"[0.431934]","Attach.ConfigureDebuggingSession.Target":"[120.704226]","WaitingAfter.ClientRequest/launch":"[2369.170056]","WaitingAfter.NotifyInitialized":"[2391.895452]","RequestedNavigateToUserPage":"[2755.663593]","Attach.ConfigureDebuggingSession.End":"[395.650265]"}}}
[17:04:50.872 UTC] ← From target: {"method":"Runtime.executionContextCreated","params":{"context":{"id":2,"origin":"http://127.0.0.1:5500","name":"","auxData":{"isDefault":true,"type":"default","frameId":"064DC8B5E5403FED12A152F9A42B4893"}}}}
[17:04:50.873 UTC] ← From target: {"method":"Log.entryAdded","params":{"entry":{"source":"network","level":"error","text":"Failed to load resource: the server responded with a status of 404 (Not Found)","timestamp":1.589821490867167e+12,"url":"http://127.0.0.1:5500/dist/emails-input__form-example.html","networkRequestId":"090E0F5CAC0AA9179D62839E3FBF8020"}}}
[17:04:50.874 UTC] To client: {"seq":0,"type":"event","event":"output","body":{"category":"stderr","output":"Failed to load resource: the server responded with a status of 404 (Not Found) [http://127.0.0.1:5500/dist/emails-input__form-example.html]\n"}}
[17:04:50.992 UTC] ← From target: {"method":"Page.loadEventFired","params":{"timestamp":33991.827034}}
[17:04:50.993 UTC] ← From target: {"method":"Page.frameStoppedLoading","params":{"frameId":"064DC8B5E5403FED12A152F9A42B4893"}}
[17:04:50.993 UTC] ← From target: {"method":"Page.domContentEventFired","params":{"timestamp":33991.925795}}
[17:04:50.998 UTC] ← From target: {"method":"Log.entryAdded","params":{"entry":{"source":"network","level":"error","text":"Failed to load resource: the server responded with a status of 404 (Not Found)","timestamp":1.589821490996633e+12,"url":"http://127.0.0.1:5500/favicon.ico","networkRequestId":"11571.2"}}}
[17:04:50.998 UTC] To client: {"seq":0,"type":"event","event":"output","body":{"category":"stderr","output":"Failed to load resource: the server responded with a status of 404 (Not Found) [http://127.0.0.1:5500/favicon.ico]\n"}}
[17:04:58.109 UTC] To client: {"seq":0,"type":"event","event":"output","body":{"category":"telemetry","output":"target/notification/onScriptParsed","data":{"Versions.DebugAdapterCore":"6.8.9","Versions.DebugAdapter":"4.12.7","Versions.Target.CRDPVersion":"1.3","Versions.Target.Revision":"@8c6c7ba89cc9453625af54f11fd83179e23450fa","Versions.Target.UserAgent":"Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/81.0.4044.138 Safari/537.36","Versions.Target.V8":"8.1.307.32","Versions.Target.Project":"Chrome","Versions.Target.Version":"81.0.4044.138","aggregated.startTime":"[\"1589821490488\"]","aggregated.successful":"[\"true\"]","aggregated.timeTakenInMilliseconds":"[\"6.963062\"]"}}}
在找到 vscode 拒绝附加断点的原因的巨大痛苦之后，我找到了解决它的原因和方法。
好吧，通过 launch.json 设置 "trace": "verboser", 我发现了这个痕迹：
SourceMaps.setBP: /Users/gilsoncav/dev-js/emails-tags-input/src/emails-input.ts can't be resolved to a loaded script. It may just not be loaded yet.
Paths.setBP: No target url cached yet for client path: /Users/gilsoncav/dev-js/emails-tags-input/src/emails-input.ts.
我去 Chrome DevTools 查看 SourceMap 在那里...
请注意，源映射脚本的路径是 webpack://EmailsInput/./...，这就是为什么 launch.json 中的以下传统设置不起作用的原因
"sourceMapPathOverrides": {
"webpack:///./*": "${workspaceFolder}/*"
}
因此，解决方法是将其设置为：
"sourceMapPathOverrides": {
"webpack://EmailsInput/./*": "${workspaceFolder}/*"
}
为什么会有这个该死的EmailsInput？我发现罪魁祸首是我在 webpack.config.js 中使用的 library 设置：
...
output: {
filename: 'emails-input.js',
// Setting webpack to generate the library with a global variable as
// the spec of the test is suggesting
library: 'EmailsInput',
libraryTarget: 'var',
libraryExport: 'default',
globalObject: 'this',
path: path.resolve(__dirname, 'dist'),
},
...