Gil*_*nti 6 javascript typescript webpack visual-studio-code vscode-debugger
浪费时间试图让 vscode 调试器在这个项目中运行。使用:
这个想法是生成一个与 ie11 兼容的纯香草 JS 组件。这是它的行动:

链接到现场示例:https : //gilsoncav.github.io/emails-tags-input/dist/index.html
链接到 repo:https : //github.com/gilsoncav/emails-tags-input
我在开发过程中使用 Live Server 扩展进行测试(但我怀疑该问题与此有关)。
当我尝试启动调试会话时,断点未“安装”。
我的package.json相关部分
"scripts": {
"dev": "webpack --mode development --watch",
"build": "webpack --mode production"
},
Run Code Online (Sandbox Code Playgroud)
我的webpack.config.js文件:
"scripts": {
"dev": "webpack --mode development --watch",
"build": "webpack --mode production"
},
Run Code Online (Sandbox Code Playgroud)
我的.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/*"
}
}
Run Code Online (Sandbox Code Playgroud)
调试控制台转储:
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":"0
Gil*_*nti 10
在寻找 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.
Run Code Online (Sandbox Code Playgroud)
我去 Chrome DevTools 检查 SourceMap 是如何在那里...

请注意,源映射脚本的路径是webpack://EmailsInput/./...以下传统设置launch.json不起作用的原因
"sourceMapPathOverrides": {
"webpack:///./*": "${workspaceFolder}/*"
}
Run Code Online (Sandbox Code Playgroud)
因此,修复方法是将其设置为:
"sourceMapPathOverrides": {
"webpack://EmailsInput/./*": "${workspaceFolder}/*"
}
Run Code Online (Sandbox Code Playgroud)
这该死的为什么EmailsInput会在那里??我发现罪魁祸首是library我在 webpack.config.js 中使用的这个设置:
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.
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
3045 次 |
| 最近记录: |