前提条件
- vagrantにXdebugが正しくインストールされていること
- VisualStudioCodeがインストールされていること
- PHP7であること※今回はPHP7を使用するため
- 仮想環境のWebサーバがNginxであること
- 筆者はWindowsです
上記の環境に合わせて作りたいなと思う方はこちらへ※今回はこんなかんじの環境です
php環境構築(Vagrant + VirtualBox + php7 + Nginx1.10 + MariaDB10~)
EclipseやNetBeansを卒業しようかなと思い、やってみたら意外とはまったので、共有です。
デバッグができるようにするフロー
１．デバッグの構成を開く
デバッグ ＞ 構成を開くを押下する
２．launch.jsonの編集を行う
下記画像とは、違う記述がされていると思いますが、
結論からいえば、以下の部分を自分の環境を合わせるといいと思います。
主に合わせていただくのは、以下の3点くらいだと思います。
serverSourceRoot: "接続先サーバー上のドキュメントルート",
localSourceRoot: "ローカルマシン上のソースコードのディレクトリ",
port: "php.iniで記載したxdebugのportを記載する"
serverSourceRootとlocalSourceRootの関係性は、
EclipseやNetBeansなどに言い換えると、パスマッピングです。
※ちなみに、localSourceRoot: "${workspaceRoot}"は、VSCodeで開いているディレクトを指定するという意味。
今回は、絶対パスで指定しています。
３．ファイル ＞ 基本設定 ＞ 設定を開く
４．設定の編集
結論から言えば、以下画像のように記載する必要があります。
Debugの紐付けとは関係ないのですが、Debugを快適にするために、以下の設定が必要になってきます。
４－１．ローカルにPHPがない場合、インストールする
以下からダウンロードして自分の好きなディレクトリにデプロイしてください。
※今回は、前提として、NginxでありVagrantで作成した環境にxdebugがインストールされていることなので、VC14 x64 Non Thread SafeのZipをダウンロードしてデプロイします。
http://windows.php.net/download#php-7.0
４－２．パスを設定する
好きなディレクトリに展開したら、
php.validate.executablePath: "展開先のphp.exeまでのパス",
php.executablePath: "展開先のphp.exeまでのパス"
上記のphp.executablePathは、VSから読み込まれず、緑の波線が出るのですが、
これがないとうまく読み込んでくれないみたいです。
５．拡張機能を導入する
左の上から5番目のマークを押すと、拡張機能されている一覧が開きます。
なにもいれていないと何も出ないはずです。
そこでPHP IntelliSenseとPHP Debugがなければ、インストールします！
上部にある検索欄からPHPと入力すればPHP関連の拡張モジュールが出ますので、
そこからインストールをします！
６．拡張機能を読み込みなおして、いざデバッグ！！
F5を押すとすぐにデバッグが開始されて一番下のバーがオレンジに変わります！
ちなみに複数のデバッグ環境を作成したいた際は、デバッグ画面が開いた上部にプルダウンで切り替えられるので、お手軽に切り替えをします。
あとはいままでどおりとめたいところで、エディターに赤い点をうつだけで！
以上が、VisualStudioCodeからデバッグを行う方法でした。
お疲れ様でした！