DEV Community

Anthony Bañon Arias
Anthony Bañon Arias

Posted on • Edited on

Debug

#php #java #python #node

🐞 Cómo Configurar Debug en VS Code para Python, Java, JavaScript y PHP (Xubuntu 24.04)

⚙️ Una guía paso a paso para tener un entorno de desarrollo moderno
y funcional en VS Code con depuración incluida para los lenguajes
más usados.

📦 Requisitos previos

  • Tener VS Code instalado
  • Tener los lenguajes configurados en tu sistema:
    • ✅ Python 3.x
    • ✅ Java (OpenJDK 17 recomendado)
    • ✅ Node.js (v18 o superior)
    • ✅ PHP (8.2 con Xdebug)
  • Sistema base: Xubuntu 24.04

🐍 Debug en Python

🧩 Extensión necesaria 

📦 Python (de Microsoft)

🔧 Configuración launch.json 

{ "type": "debugpy", "name": "Python Debugger: Current File", "request": "launch", "program": "${file}", "console": "integratedTerminal" },
Enter fullscreen mode Exit fullscreen mode

✅ Uso

  • Abrí un archivo .py
  • Colocá un breakpoint
  • Ejecutá con F5 o desde el menú "Run and Debug"

☕ Debug en Java

🧩 Extensiones necesarias

Java Extension Pack
Language Support for Java (Red Hat)

🔧 Configuración automática

Cuando VS Code detecta un archivo .java con método main(), ofrece configurar automáticamente launch.json.

 { "type": "java", "name": "Java: execute current file", "request": "launch", "mainClass": "", "console": "integratedTerminal", "cwd": "${fileDirname}", "projectName": "", "preLaunchTask": "Compilar Java actual" }, { "type": "java", "name": "JavaFX: execute current file", "request": "launch", "mainClass": "", "vmArgs": "--module-path /home/anthony/Documentos/xubuntu/javafx-sdk-21.0.6/lib --add-modules javafx.controls,javafx.fxml", "console": "integratedTerminal", "cwd": "${fileDirname}", "projectName": "", "preLaunchTask": "Compilar JavaFX actual" },
Enter fullscreen mode Exit fullscreen mode

Para usar JavaFx, hay que descargar la biblioteca desde JavaFX

🟨 Debug en JavaScript (Node.js)

🧩 Extensión necesaria 

📦 JavaScript Debugger (viene por defecto desde VS Code 2023)

🔧 Configuración launch.json 

{ "type": "node", "name": "Node.js: Debug archivo actual", "request": "launch", "program": "${file}", "console": "integratedTerminal" },
Enter fullscreen mode Exit fullscreen mode

✅ Alternativa con package.json 

"scripts": { "start": "node archivo.js", "debug": "node --inspect-brk archivo.js" }
Enter fullscreen mode Exit fullscreen mode

Luego corré:

npm run debug
Enter fullscreen mode Exit fullscreen mode

Y conectate desde VS Code con F5.

🐘 Debug en PHP con Xdebug

🧩 Extensión necesaria 

📦 PHP Debug de Felix Becker

🔧 Instalar Xdebug 

sudo apt install php-xdebug
Enter fullscreen mode Exit fullscreen mode

🔧 Configurar /etc/php/8.2/cli/php.ini 

; Xdebug para debug con VS Code [xdebug] zend_extension=xdebug.so xdebug.mode=debug xdebug.start_with_request=yes xdebug.client_port=9003 xdebug.client_host=127.0.0.1
Enter fullscreen mode Exit fullscreen mode

🔧 Configuración launch.json 

 { "type": "php", "name": "Listen for Xdebug (PHP)", "request": "launch", "port": 9003 },
Enter fullscreen mode Exit fullscreen mode

✅ Uso

  • Colocá un archivo .php en la ruta del servidor (ej: /home/anthony/server/php/)
  • Colocá un breakpoint
  • Ejecutá con php archivo.php o por navegador
  • Presioná F5 en VS Code

🧪 Consejo final

Podés tener todas las configuraciones en un solo launch.json con varias entradas. Ejemplo:

launch.json 

{ // Use IntelliSense to learn about possible attributes. // Hover to view descriptions of existing attributes. // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387 "version": "0.2.0", "configurations": [ { "type": "java", "name": "Java: execute current file", "request": "launch", "mainClass": "", "console": "integratedTerminal", "cwd": "${fileDirname}", "projectName": "", "preLaunchTask": "Compilar Java actual" }, { "type": "java", "name": "JavaFX: execute current file", "request": "launch", "mainClass": "", "vmArgs": "--module-path /home/anthony/Documentos/xubuntu/javafx-sdk-21.0.6/lib --add-modules javafx.controls,javafx.fxml", "console": "integratedTerminal", "cwd": "${fileDirname}", "projectName": "", "preLaunchTask": "Compilar JavaFX actual" }, { "type": "debugpy", "name": "Python Debugger: Current File", "request": "launch", "program": "${file}", "console": "integratedTerminal" }, { "type": "node", "name": "Node.js: Debug archivo actual", "request": "launch", "program": "${file}", "console": "integratedTerminal" }, { "type": "php", "name": "Listen for Xdebug (PHP)", "request": "launch", "port": 9003 }, { "type": "cppdbg", "name": "Debug C/C++ (archivo actual)", "request": "launch", "program": "${fileDirname}/${fileBasenameNoExtension}", "args": [], "stopAtEntry": false, "cwd": "${fileDirname}", "environment": [], "externalConsole": false, "MIMode": "gdb", "setupCommands": [ { "description": "Habilitar pretty-printing", "text": "-enable-pretty-printing", "ignoreFailures": true } ], "preLaunchTask": "build actual", "miDebuggerPath": "/usr/bin/gdb" } ] }
Enter fullscreen mode Exit fullscreen mode

tasks.json 

{ "version": "2.0.0", "tasks": [ { "type": "shell", "label": "build actual", "command": "sh", "args": [ "-c", "ext=\"${1##*.}\"; if [ \"$ext\" = \"c\" ]; then gcc -g \"$1\" -o \"$2\"; elif [ \"$ext\" = \"cpp\" ]; then g++ -g \"$1\" -o \"$2\"; fi", "--", "${file}", "${fileDirname}/${fileBasenameNoExtension}" ], "problemMatcher": ["$gcc"], // gcc problem matcher "group": { // group for build tasks "kind": "build", // build group or Test group "isDefault": true // default build task } }, { "label": "Compilar Java actual", "type": "shell", "command": "javac", "args": [ "${file}" ], "options": { "cwd": "${workspaceFolder}/Java" }, "group": "build", "problemMatcher": [] }, { "label": "Compilar JavaFX actual", "type": "shell", "command": "javac", "args": [ "--module-path", "/home/anthony/Documentos/xubuntu/javafx-sdk-21.0.6/lib", "--add-modules", "javafx.controls,javafx.fxml", "${file}" ], "options": { "cwd": "${fileDirname}" }, "group": "build", "problemMatcher": [] } ] }
Enter fullscreen mode Exit fullscreen mode

settings.json 

{ "java.project.referencedLibraries": [ "/home/anthony/Documentos/xubuntu/javafx-sdk-21.0.6/lib/**/*.jar" ], "java.project.sourcePaths": [ "Java" ], "java.configuration.runtimes": [ { "name": "JavaSE-21", "path": "/usr/lib/jvm/java-21-openjdk-amd64", "default": true } ] }
Enter fullscreen mode Exit fullscreen mode

🎯 Conclusión

VS Code te permite trabajar de forma profesional en múltiples lenguajes con una sola herramienta. Tener configurado el debugger te da una ventaja enorme para aprender y desarrollar mejor.

✍️ Escribí, rompé, debugueá... y aprendé!
Enter fullscreen mode Exit fullscreen mode

Top comments (0)