VSCodeの拡張機能を使ってデバッグ環境を作る方法を解説します。

拡張機能のダウンロード

予めPHP Debugという拡張機能をインストールしておきます。

.envの書き換え

laradockディレクトリ下の.envを下記の2つの変数をfalseからtrueに書き換えます。

WORKSPACE_INSTALL_XDEBUG=true
PHP_FPM_INSTALL_XDEBUG=true

Xdebugの書き換え

laradock/php-fpm/xdebug.ini
laradock/workspace/xdebug.int の変数を下記のように書き換えます。

xdebug.ini

xdebug.remote_host=docker.for.mac.localhost
xdebug.remote_connect_back=0
xdebug.remote_port=9001
xdebug.idekey=Listen for XDebug

xdebug.remote_autostart=1
xdebug.remote_enable=1
xdebug.cli_color=1
xdebug.profiler_enable=0
xdebug.profiler_output_dir="~/xdebug/phpstorm/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

containerの再構築

docker-compose up -d --build nginx mysql

--buildオプションで起動します。イメージがある状態でも再度ビルドしてcontainerを立ち上げてくれます。

Visual Studio Codeの設定

プログラム実行の設定（デバッグの設定）を行うのが.vscode/launch.jsonファイルです。

作業ディレクトリのlaunch.jsonファイルを作成して、下記を記述します。user_app_nameのところには自分のappディレクトリの名前をいれてください。

vscode/launch.json

{
    "version": "0.2.0",
    "configurations": [
        {
            "name": "Listen for XDebug",
            "type": "php",
            "request": "launch",
            "port": 9001,
            "pathMappings": {
                "/var/www": "${workspaceFolder}/user_app_name"
            },
            "log": true
        }
}

デバッグの実行

ソースの行番号の左側を押して、ブレークポイントを設定。
サイドバーのデバッグのボタンを押して、[Listen for XDebug]を選択し、RUNの△を押せば準備完了。ブレークポイントのところで止まるようになります。

【VSCode】Laradockでデバッグできるようにしようぜ!!【Mac】