He buscado a lo largo y ancho, pero no puedo averiguar cómo obtener vscode para depurar el javascript de vainilla incluido en una página HTML simple a través de Chrome. Obtengo "punto de interrupción sin vincular" para todos los puntos de interrupción en todos los archivos javascript.
El HTML se sirve a través del complemento vscode Live Server. El depurador de vscode se adjunta con éxito a Chrome a través del siguiente archivo launch.json. Puedo ver la consola del navegador en la consola de depuración en vscode, pero todos los puntos de interrupción están "independientes".
{ "version": "0.2.0", "configurations": [ { "type": "chrome", "request": "attach", "name": "Attach to Chrome", "url": "http://127.0.0.1:3001/*", "port": 9222, "webRoot": "/_webroot", "sourceMaps": false, "trace": false } ] } Tengo _webroot configurado porque esa es la raíz desde donde Live Server sirve los archivos. Esto parece no tener efecto.
Todos los archivos javascript se cargan en tiempo de ejecución en el navegador a través de etiquetas de script simples como:
<script src="js/customcode.js"></script>No estoy usando un administrador de paquetes. Ningún nodo involucrado en absoluto.
Cualquier ayuda sería muy apreciada.
Respondiendo a mi propia pregunta. La solución fue:
{ "version": "0.2.0", "configurations": [ { "type": "chrome", "request": "attach", "name": "Attach to Chrome", "url": "http://127.0.0.1:3001/*", "port": 9222, "webRoot": "${workspaceRoot}/_webroot", "sourceMaps": false, "trace": false } ] }