PHP

VsCodeでPHPのデバック(XDebug)を効率よく進める方法(MacOS)

  /

こんにちはジャムです。

今回はVScodeでPHPのデバックを効率よく進める方法です。

今回の想定読者
  • エディターにVSCodeを使っている方
  • Macユーザー
  • var_dumpに飽きた人
Contents
  1. 紹介する環境
  2. XDebugのインストールと設定
  3. apacheの設定
  4. VScodeの設定

紹介する環境

  • MacOS Catalina 10.15.7
  • PHP ver7.2 (homebrew)
  • Apache 2.4.41 (Mac搭載）
  • VSCode 1.46.1

XDebugのインストールと設定

Xdebugをpeclでインストール

$ pecl install xdebug

xdebugインストール時にフォルダが作れないよ！みたいなエラーがでたら、/usr/local/Cellar/php@7.2/7.2.31_1のpeclのシンボリックリンクを消してください。

php.iniファイルに設定を記載

iniファイルの場所が分からない場合

$ php --ini
Configuration File (php.ini) Path: /usr/local/etc/php/7.2
Loaded Configuration File:         /usr/local/etc/php/7.2/php.ini
Scan for additional .ini files in: /usr/local/etc/php/7.2/conf.d
Additional .ini files parsed:      /usr/local/etc/php/7.2/conf.d/ext-opcache.ini

php.iniをviで開く

$ vi /usr/local/etc/php/7.2/php.ini

xdebugを使用するための記述を追記します。

[XDebug]
zend_extension=/usr/local/Cellar/php@7.2/7.2.31_1/pecl/20170718/xdebug.so
xdebug.remote_enable = 1
xdebug.remote_autostart = 1
xdebug.remote_connect_back = 1
xdebug.remote_port = 9000

apacheの設定

httpd.confの設定変更

httpd.confのファイルがある場所まで移動

$ cd /etc/apache2

変更が不安な方はバックアップを

$ sudo cp httpd.conf httpd.conf.org

hppd.confの編集

  1. 元々のDocumentRootを”#”でコメントアウト
  2. DocumentRootをプロジェクトのindex.phpがある場所に変更
# DocumentRoot "/Library/WebServer/Documents"
DocumentRoot "自分のプロジェクトフォルダを指定"

apacheを再起動

$ sudo apachectl restart

VScodeの設定

PHP Debugのインストール

  1. VSCodeのライブラリボタンをクリック
  2. phpと入力
  3. PHP Debugのインストール

apacheにて設定したDocumentRootを開く

  1. デバックアイコンをクリック
  2. launch.jsonファイルを作成
  3. PHPを選択
  1. ブレークポイントを決める
  2. 実行

ブラウザで更新

以下のように変数やPOST、クッキーなどの情報を確認することができます。

以上です。

RELATED POST