VSCodeでPHPをデバッグできる環境の設定方法

VSCodeでPHPをデバッグできる設定で実際の操作手順の備忘録

前提

• OSはWindows11（バージョン25H2）
  

• VSCodeエディタがインストール済（1.126.0）
  

• XAMPPがCドライブ直下にインストール済（v3.3.0/PHP8.2.12）

• DocumentRootが"C:\xampp\htdocs"である

操作手順

1. VSCode設定ファイル(settings.json)の編集
2. VSCode拡張機能「PHP Debug」のインストール
3. PHPデバッグツール「XDebug」のインストール
4. 「XDebug」とPHPを関連付け
5. デバッグを行う

1. VSCode設定ファイル(settings.json)の編集

VSCodeのコマンドパレット(CTRL+Shift+P)を開き"settings.json"と打ちEnter

settings.jsonが開くので以下の例のように編集する

{
    "files.autoSave": "afterDelay",
    "php.debug.executablePath": "C:\\xamp\\php\\php.exe"
}

2. VSCode拡張機能「PHP Debug」のインストール

VSCodeの拡張機能(CTRL+Shift+x)を開き"PHP Debug"と打つ
"PHP Debug"がリストに現れたらそれを選択してインストールをクリック
ボタンが「アンインストール」に変わったらインストール完了

3. PHPデバッグツール「XDebug」のインストール

1)PHP詳細情報（phpinfo）を表示

C:\xampp\htdocs配下にphpinfo.phpというファイルを作り、その中身に以下のPHPコードを記載する

phpinfo.php

<?php
	phpinfo();
?>

XAMPPを起動してApacheをスタートして

ブラウザを開いてアドレスバーに

http://localhost/phpinfo.php

と打ってEnter
現在動作しているPHPの詳細情報が表示されるので、この画面の文字をすべてコピーする（画面の適当な場所でクリックしたのち全選択(CTRL+a)してコピー(CTRL+c)する）

2)「XDebug」のDLLファイル生成

ブラウザでhttps://xdebug.org/wizard.php を開き、先ほどコピーした文字をテキストボックスに貼り付け、

「Analyse my phpinfo() output」ボタンをクリックし、表示されたDLLファイルをダウンロード。

ダウンロードしたDLLファイルを"C:\xampp\php\ext"に移動する

4. 「XDebug」とPHPを関連付け

XAMPPのApache行のconfigボタンをクリックしてphp.iniを開く
[PHP]に追記する

php.ini

[PHP]
....
;zend_extension=opcache
xdebug.mode=debug
xdebug.start_with_request=yes

[XDebug]をファイル末尾に追加する

php.ini

[XDebug]
xdebug.remote_enable = 1
xdebug.remote_autostart = 1
xdebug.remote_connect_back = 1
xdebug.remote_port = 9003
zend_extension = "php_xdebug-3.5.3-8.2-ts-vs16-x86_64.dll"

5. デバッグを行う

VSCodeの実行とデバッグ(CTRL+Shift+D)を開く
デバッグ開始の右リストから"Listen for Xdebug"が選択されていることを確認して
デバッグ開始ボタンをクリックする

プログラムコードの左側番号でブレイクポイントにしたい箇所をクリックする

処理を実行させてブレイクポイントで停止すれば成功！！