EC-CUBE+Docker+xdebug+VSCode環境を作る

EC-CUBE4の解析を行うのが難しいのでデバッグ機能を実装してみた。多分、EC-CUBEに限らず、Docker/VSCodeで開発してる人は参考になると思う。

Windows環境でやるていで記載していきます。

＜参考＞
・Docker+EC-CUBEの環境を構築する
・VSCodeからDockerにつなぐ

手順

適当な場所にフォルダを作成する(日本語が入ってないところがいいかも)
(例)C:\temp配下に『aaa』というフォルダを作成する

コマンドプロンプト作業

適当に作成したフォルダに移動する

cd C:\temp\aaa

EC-CUBEを落とす

git clone -b 4.0.5 https://github.com/EC-CUBE/ec-cube.git

xdebugセットを落とす

git clone https://github.com/Kouhei-Ichikawa-wq/eccube_xdebug.git

xdebugセットをコピーする

xcopy /e /y eccube_xdebug ec-cube

Docker起動の場所へ移動する

cd ec-cube

Dockerを起動させる

docker-compose up -d

EC-CUBEのインストールを行う

docker-compose exec -u www-data ec-cube bin/console eccube:install

VSCode作業

VSCodeからDockerにアタッチする

左側の虫マークをクリックして『実行とデバッグ』をクリックする

『拡張機能をインストールする...』をクリックする

入力項目が出てくるので『@￰category:"debuggers" "PHP"』を入力して、『PHP Debug』をインストールする。

『launch.josonファイルを作成します。』をクリックする

『.vscode/launch.json』ファイルの内容が表示される。
『Listen for Xdebug』の再生ボタンをクリックする。

※これでxdebugは動き始めました。

動作確認

適当にソースコードからブレイクポイント貼る。
EC-CUBEのトップページが表示されたときにブレークされるようにする。
『/src/Eccube/Controller/TopController.php』の『index()のretrun[];』に貼る(２７行目)
トップページを表示する。ブレークポイントを貼った箇所でストップしていることが分かる。

感想

実機(xamp)におけるxdebugの情報は結構あったんだけど、Dockerのコンテナ内のソースでVSCodeを使うってのは情報があまりなくてしんどかった。これでEC-CUBEが少しでも流行るといいなあ。