【Visual Studio Code】XdebugをXAMPPで設定する手順

Xdebugと拡張機能「PHP Debug」を導入し、Visual Studio CodeにPHPデバッグができる環境を構築。XAMPPとVisual Studio Codeがインストールされている前提。

・XAMPP

・Visual Studio Code

Visual Studio CodeでPHPデバッグができるまでの流れ

大体以下のような流れ。

phpinfo()で出力された情報を全てコピーし、以下のサイトのテキストエリアに貼り付けると、スムーズにインストールすることができる。

Windowsの場合は、.dllをインストールして、\xampp\php\extに配置すればok。ただ大体の場合は元々\xampp\php\extに存在しているため、わざわざインストールする必要はないかも。

php.iniにインストールしたXdebugの情報を追記。今回はXAMPPのApache使用のため、9000番ポートはコメントアウトしてます。

C:\xampp\php\php.ini

[XDebug]

zend_extension = "C:\xampp\php\ext\php_xdebug.dll"

xdebug.remote_enable=1

xdebug.remote_host=localhost

; xdebug.remote_port=9000

xdebug.remote_handler=dbgp

xdebug.remote_mode=req

xdebug.remote_autostart=true

追記したら、phpinfo()でXdebugが記載されていることを確認します。

拡張機能「PHP Debug」をインストールします。

インストール完了後、画面左のツールバーから虫のアイコンを選択。画面上部にある歯車アイコンを選択し、PHPをクリック。

するとlaunch.jsonファイルが生成されるため、以下のように追記しました。先ほどのphp.iniに9000番ポートを指定した場合は、80→9000に読み替えてください。

・launch.json

{

"version": "0.2.0",

"configurations": [

{

"name": "Custom Xdebug setting",

"type": "php",

"request": "launch",

"port": 80,

"serverSourceRoot": "${workspaceRoot}",

"localSourceRoot": "${workspaceRoot}"

]

}

あとはブレークポイント設定し、構成の名前を指定してデバッグを実行するだけ。なのに結構ハマってしまった…。