Depurar código PHP en VSCode con Ubuntu Linux

---

Editado el 22 de Julio del 2020 a las 13:25:29 por Rafael Corro

---

---

En este artículo mostraré los pasos a seguir para preparar el editor Visual Studio Code para poder depurar código PHP.

 Instalación de XDebug en Ubuntu:

1.- Mostrar página phpinfo();
     Podemos crear una pagína  en nuestro localhost para que muestre la información PHP.
2.- Copiar contenido  pulsando Ctrl+a y Ctrl+c

3.- Abrir https://xdebug.org/wizard
4.- Pegar contenido en el textarea y pulsar el botón:  Analyse my phpinfo() output.
5.- Seguimos las instrucciones que no ha dado la página:

    a.- Descargamos xdebug
    b.- Instalamos las herramientas para compilar extensiones php
            sudo apt-get install php-dev autoconf automake
    c.- Descomprimimos el archivo descargado de xdebug
            sudo tar -xvzf xdebug-2.9.6.tgz
    d.- Instalamos phpize
            apt-get install php7-devel
    e.- Entramos en la carpeta descomprimida de xdebug
    f.-  Ejecutamos phpize
            sudo phpize


6.- Añadimos unas lineas al final del php.ini
        cd /etc/php/7.2/apache2/
        sudo nano php.ini
        
        [XDebug]
        xdebug.remote_enable = 1
        xdebug.remote_autostart = 1
        
7.- Comprobamos en el phpinfo() que está funcionando la extension.

        
Configuramos Xdebug en VSCode ____________________________

1.- Instalamos las siguientes extensiones:
     PHP IntelliSense 2.3.14
     PHP Debug 1.13.0

2.- Configuración de launch.json:

 ...
        
        {
            "name": "Listen for XDebug",
            "type": "php",
            "request": "launch",
            "port": 9000
        },
        {
            "name": "launch currently open script",
            "type": "php",
            "request": "launch",
            "program": "$(file)",
            "cwd": "$(fileDirname)",
            "port": 9000
        
        },
        {
                "type": "pwa-chrome",
                "request": "launch",
                "name": "Launch Chrome against localhost",
                "url": "http://localhost",
                "webRoot": "${workspaceFolder}"
        }
       

Comenzamos la depuración:

Marcamos los breakpoint, abrimos el navegador Chromium o Chrome y pusamos F10 para dar un paso hacia adelante y F11 para realizar la depuración más a fondo.

Y eso es todo ;)

---