Tengo una pregunta similar a esta sin respuesta. Todavía no se me permite comentar sobre dicha pregunta.
¿Es posible y, de ser así, cómo puedo depurar los componentes JS de mi aplicación Flask desde VSCode?
Tengo la siguiente configuración de depuración:
"version": "0.2.0", "configurations": [ { "name": "Python: Flask - Dev", "type": "python", "request": "launch", "module": "flask", "env": { "PIPENV_VENV_IN_PROJECT":"1", "FLASK_APP":"run.py", "FLASK_ENV":"development", "FLASK_DEBUG":"1", "TEMPLATES_AUTO_RELOAD" : "1" }, "args": [ "run" ], "jinja": true }, { "name": "Python: Flask - initDB", "type": "python", "request": "launch", "module": "flask", "env": { "PIPENV_VENV_IN_PROJECT": "1", "FLASK_APP": "run.py", "FLASK_ENV": "development", "FLASK_DEBUG": "1", }, "args": [ "run", "--no-reload" // Use for initial dev DB deploy ], "jinja": true } ]Por lo que deduzco, es posible utilizar la función de depuración remota de Firefox Developer Edition con sus propias configuraciones según aquí .
¿Alguna idea sobre cómo combinar estas configuraciones? ¿O tal vez otra solución al problema por completo?
Sé que esto es tarde, pero pensé en dejar esto aquí para otros.
Para mí, se trataba de configurar correctamente la propiedad "webRoot". Aquí está mi configuración
{ "type": "pwa-chrome", "request": "launch", "name": "Launch Chrome", "url": "http://localhost:5001/", "webRoot": "${workspaceFolder}/wserver", }"webRoot" debe apuntar al directorio raíz que carga el servidor. Abra la página/aplicación que está tratando de depurar y busque en la pestaña Fuentes en las herramientas para desarrolladores para ver el directorio web raíz.
Dado que el árbol en la pestaña Fuentes se parece a lo siguiente; "webRoot" debe apuntar al directorio principal local de (en mi caso) la carpeta estática. En mi caso "servidor"
Ruta del directorio local:
FlaskApp/wserver/static/scripts/myscript.js
Árbol de fuentes de DevTools:
> localhost:5001 > static > scripts > myscript.jsA partir de la última versión de vscode, no necesita instalar ninguna extensión adicional.