Setup Visual Studio Code + Laradock + xDebug

This article serves to explain how to use xDebug with Laradock in Visual Studio Code.

Viusal Studio Code

Visual Studio Code is a code editor redefined and optimized for building and debugging modern web and cloud applications. Visual Studio Code is free and available on your favorite platform — Linux, macOS and Windows.

Laradock

Laradock is a full PHP development environment for Docker.

It supports a variety of common services, all pre-configured to provide a ready PHP development environment.

xDebug

xDebug is an extension for PHP to assist with debugging and development.

• It contains a single step debugger to use with IDEs
• it upgrades PHP’s var_dump() function
• it adds stack traces for Notices, Warnings, Errors and Exceptions
• it features functionality for recording every function call and variable assignment to disk
• it contains a profiler
• it provides code coverage functionality for use with PHPUnit

Edit the .env file inside the Laradock folder

• nano .env
• Find WORKSPACE_INSTALL_XDEBUG and replace it’s value by true
• Find PHP_FPM_INSTALL_XDEBUG and replace it’s value by true

Edit the xDebug configuration files

• nano workspace/xdebug.ini
• nano php-fpm/xdebug.ini
• Replace the contents of both files with:

xdebug.remote_host=host.docker.internal
xdebug.remote_connect_back=1
xdebug.remote_port=9000
xdebug.idekey=VSCODE
xdebug.remote_autostart=1
xdebug.remote_enable=1
xdebug.cli_color=1
xdebug.profiler_enable=1
xdebug.profiler_output_dir="~/xdebug/vscode/tmp/profiling"
xdebug.remote_handler=dbgp
xdebug.remote_mode=req
xdebug.var_display_max_children=-1
xdebug.var_display_max_data=-1
xdebug.var_display_max_depth=-1

Rebuild the workspace and php-fpm containers and restart them

• docker-compose build workspace php-fpm
• docker-compose up -d workspace php-fpm
• docker-compose restart workspace php-fpm

Activate xDebug in Visual Studio Code

• In the Visual Studio Code menu, click Run and then Add Configuration
• Add the configuration below:

{
    "name": "Listen for XDebug",
    "type": "php",
    "request": "launch",
    "port": 9000,
    "log": true,
    "pathMappings": {
        "/var/www": "${workspaceRoot}",
    },
    "ignore": [
        "**/vendor/**/*.php"
    ]
}

Start/Stop xDebug

By installing xDebug, you are enabling it to run on startup by default.

To control the behavior of xDebug (in the php-fpm Container), you can run the following commands from the Laradock root folder, (at the same prompt where you run docker-compose):

Stop xDebug from running by default: ./php-fpm/xdebug stop.
Start xDebug by default: ./php-fpm/xdebug start.
See the status: ./php-fpm/xdebug status.

It’s ready, now you can start using xDebug in the Visual Studio Code.