primera pregunta aqui...
Tengo dificultades para depurar JavaScript con VS Code y Chrome. Solía tener instalada la extensión "Debugger for Chrome" y funcionó perfectamente. Sin embargo, después de que VS Code incorporó esta funcionalidad y desechó la extensión, mis puntos de interrupción ya no son vinculantes. Una vez que se carga la página, se atenúan y se muestran como independientes. Si hago clic en el ícono "Alternar activar puntos de interrupción", entonces comienzan a funcionar. Si se vuelve a cargar la página, debo hacerlo de nuevo, bastante dolor…
Intenté "iniciar" y "adjuntar" en Chrome o Edge, el mismo problema.
Tengo una máquina Win11 y mi proyecto se ejecuta en la carpeta “C:\wamp64\www\sistemas\felina\”. Este es mi lanzamiento.json:
"version": "0.2.0", "console": "integratedTerminal", "configurations": [ { "name": "teste", "type": "pwa-chrome", "request": "launch", "url": "http://localhost/sistemas/felina/TESTE.html", "webRoot": "${workspaceFolder}", }, ]Fui a la paleta de comandos y ejecuté "Depurar: diagnosticar problemas de punto de interrupción", este es el resultado:
resultado del diagnóstico del depurador
Tengo curiosidad por qué se muestra
“C:/wamp64/www/sistemas/felina/C:/wamp64/www/sistemas/felina/js/teste.js:5:1”.
El camino está duplicado.
Dice "Es posible que deba ajustar el webRoot en su launch.json si está creando desde una subcarpeta, o modificar su sourceMapPathOverrides". pero no tengo ni idea de que hacer.
Estoy usando VS Code versión 1.62.3 (la última).
Así que finalmente lo logré, de hecho estaba relacionado con los caminos. Así es como lo resolví:
En primer lugar, en mi servidor local todos los proyectos están en esta estructura de carpetas:
C:/wamp64/www/sistemas/proyectoA/
C:/wamp64/www/sistemas/proyectoB/
(..)
C:/wamp64/www/sistemas/proyectoZ/
Sin embargo, uso un solo host virtual, que apunta a "C:/wamp64/www".
Noté aquí que muchas personas crean un host virtual por proyecto. Entonces, después de algunas pruebas y errores, llegué a dos soluciones:
Solución A: cree un host virtual por proyecto, apuntando a la misma ruta que {workspaceFolder} de VS Code. En este caso, la ruta sería C:/wamp64/www/sistemas/felina. Aquí, launch.json sería así:
"version": "0.2.0", "console": "integratedTerminal", "configurations": [ { "name": "Launch Felina Site", "type": "pwa-chrome", "request": "launch", "url": "http://felinavirtualhost/login.html", "webRoot": "${workspaceFolder}", }, ]Solución B: use el mismo host virtual para todos los proyectos y codifique su ruta como webRoot en launch.json:
"version": "0.2.0", "console": "integratedTerminal", "configurations": [ { "name": "Launch Felina Site", "type": "pwa-chrome", "request": "launch", "url": "http://localhost/sistemas/felina/login.html", "webRoot": "C:/wamp64/www/", }, ]Solo para que conste, elegí la solución B, me pareció menos difícil de implementar...