こちらではLocalで作ったサイトを「Xdebug+PhpStorm」でデバッグする方法について紹介しています。
※「Local」と表記したときはLocal Lightning (by Flywheel)のアプリを表し、カタカナで「ローカル」と表記したときはローカル環境を表します。
目次
Local by Flywheel+Xdebug+PhpStormでデバッグしたい
Local by FlywheelでWordPressのローカル環境を作ったら次に欲しくなるのがデバッグ環境です。
WordPressのテンプレートを作成したりプラグインを開発するときなど、デバッグ環境があると便利ですからね。
実はLocalの機能拡張を導入すると、「Xdebug+PhpStorm」でのデバッグ環境が結構簡単に準備できたりします!
大まかな流れは以下のようになります。
- Localに機能拡張をインストール
- 機能拡張からPhpStormの設定ファイルを出力
- PhpStormでデバッグ
それではその方法を順番に紹介していきます。
Localに「Xdebug+PhpStorm」機能拡張をインストール
まずLocalを起動します。
左側に並んでいるボタン(アイコン)の上から3つ目の「Add-ons」をクリックします。
Add-ons画面が開きます。
ここから様々な機能拡張がインストール出来るようになっています。
今回は「Xdebug」と「PhpStorm」を使えるようにしたいので、右の方にある「Xdebug+PhpStorm」という部分をクリックします。
これがXdebugとPhpStormを簡単に導入できる機能拡張になります。
機能拡張「Xdebug+PhpStorm」についての説明が表示されます。
Utilityタブの下にある「Add Run Configuration to PhpStorm」というリンクをクリックするだけで、PhpStormにLocalのXdebug環境が設定されるといったような説明が書かれています。
「INSTALL ADD-ON」というボタンを押すと機能拡張がインストールされます。
「ENABLE & RELAUNCH」というボタンを押すと、Localが再起動され機能拡張が有効となります。
機能拡張からPhpStormの設定ファイルを出力
Localが起動したら、左側のAdd-onsボタンを押し、Add-ons画面を開きます。
「INSTALLED」というタブを開くと「Xdebug+PhpStorm」機能拡張がインストールされていることが確認できます。
機能拡張を有効(ON)にします。
次に、デバッグしたいサイトを選びます。
今回は「test2」というサイトで試してみます。
「UTILITIES」というタブを開きます。
UTILITIESタブを開くと「Xdebug+PhpStorm」という項目が追加されています。
「ADD RUN CONFIGURATION TO PHPSTORM」というリンクがあるのでクリックします。
するとプロジェクトフォルダに「.idea」というPhpStormの設定フォルダが追加されます。
PhpStormでデバッグする
次にPhpStormを起動します。
上で「.idea」が追加されたプロジェクトのフォルダを開きます。
試しに、index.phpファイルを開いてブレークポイントを置いてみました。
メニューの「Run」->「Edit configurations」をクリックし、設定画面を開きます。
PHP Web Applicationに「Local」が追加されています。
「Server」が設定されていないので、設定していきます。
※私の使っているPhpStormがかなり古いバージョンなので、最新版では「Server」も設定されているかもしれません。
「HOST」というところにご自身のLocal Siteのホストを設定します。
分からない場合には、Localで「OVERVIEW」というタブを開くと「Site Domain」のところに書かれています。
メニューの「Run」->「Debug ‘Local’」をクリックし、デバッグを実行します。
すると先程設定したブレークポイントに引っかかりました!
これでXdebugとPhpStormを使ってデバッグする環境が整いました。
PhpStormとは?
PhpStormはPHPのIDE(統合開発環境)です。
プロジェクトの管理、コーディング、デバッグなどができます。
PhpStormは有料ですが、PHP開発では定番のIDEです。
PHP開発ができる無料のIDEならNetBeansが有名です。
Xdebugとは?
Xdebugはデバッグ出来るようにするためのPHP拡張モジュールです。
XAMPPやVagrantでローカル環境を作ったときには、自分でXdebugをインストールしなければいけません。
サーバーやPHPの知識がないとインストールするのも結構面倒です。
ですがLocalを使えばクリック数回でその環境が準備できてしまいます!
Localとは
LocalはWordPressのローカル環境を簡単に構築できるツールです。
FLYWHEELが提供していて無料で使えます。
以前は「Local by Flywheel」という名前でしたが、最近のバージョンでは「Local Lightning」に変更されています。
有料のLocal Proというバージョンもあります。
まだLocalをインストールしていない方は、こちらが参考になります。
