Setting up Xdebug to work with trellis and Visual Studio Code.

Readme.md

Set up Trellis

https://roots.io/trellis/docs/installing-trellis/

Set up php debugging in Visual Studio Code

Follow this guide: https://code.visualstudio.com/Docs/languages/php

PHP extension

https://marketplace.visualstudio.com/items?itemName=felixfbecker.php-debug
No need to install xdebug on your local machine.

.vscode/launch.json

Replace XXXXXXXXXX with example.dev or whatever from trellis/group_vars/development/wordpress_sites.yml

wordpress_sites:
  example.dev: // <-- This
  
---------------------------------------

{
    "version": "0.2.0",
    "configurations": [{
        "name": "Listen for XDebug",
        "type": "php",
        "request": "launch",
        "serverSourceRoot": "/srv/www/XXXXXXXXXX/current/web",
        "localSourceRoot": "${workspaceRoot}/site/web",
        "port": 9000
    }, {
        "name": "Launch currently open script",
        "type": "php",
        "request": "launch",
        "program": "${file}",
        "cwd": "${fileDirname}",
        "port": 9000
    }]
}

Enable debugger

Download xdebug extension for your browser https://xdebug.org/docs/remote. Links under Starting The Debugger header.

Start

Enable debugging in the browser extension. Press F5 in VS to start debugging. Voilá!

Hey man.

Thanks for this! So, we do need to install xDebug in the vagrant box, correct? I'm following the xDebug wizard.

$ wget http://xdebug.org/files/xdebug-3.0.4.tgz

two

$ sudo apt-get install php-dev autoconf automake

three

$ tar -zxvf xdebug-3.0.4.tgz

four

$ cd xdebug-3.0.4

five

$ ./configure

six

$ make

etc...

'Till you see output of php --info like:

xdebug

__   __   _      _
\ \ / /  | |    | |
 \ V / __| | ___| |__  _   _  __ _
  > < / _` |/ _ \ '_ \| | | |/ _` |
 / . \ (_| |  __/ |_) | |_| | (_| |
/_/ \_\__,_|\___|_.__/ \__,_|\__, |
                              __/ |
                             |___/

Version => 3.0.4
Support Xdebug on Patreon, GitHub, or as a business: https://xdebug.org/support

           Enabled Features<br/>(through 'xdebug.mode' setting)
Feature => Enabled/Disabled
Development Aids => ✔ enabled
Coverage => ✘ disabled
GC Stats => ✘ disabled
Profiler => ✘ disabled
Step Debugger => ✘ disabled
Tracing => ✘ disabled