実現したいこと
- DockerでLaravelの開発環境を構築する
- Xdebugを導入して、デバッグ時にブレークポイントを使えるようにする
構築したい開発環境
- PHP 7.3
- Composer 2.0
- MariaDB 10.4
- Node.js 14.15.3
2021/03/17追記 GitHubに公開しました。
結論
ディレクトリ構造
.
├── docker
│ └── web
│ ├── Dockerfile
│ ├── httpd-base.conf
│ ├── php-base.ini
│ └── php.ini
├── docker-compose.yml
└── Laravelプロジェクトのファイル、ディレクトリ
docker-compose.yml
docker-compose.yml
version : "3"
services:
web:
build: ./docker/web
ports:
- 8000:80
tty: true
stdin_open: true
volumes:
- ./:/var/www/html
- ./docker/web/php.ini:/usr/local/etc/php/php.ini
depends_on:
- db
db:
image: mariadb:10.4
restart: always
command: mysqld --character-set-server=utf8 --collation-server=utf8_unicode_ci
ports:
- 3307:3306
volumes:
- "./mysql:/var/lib/mysql"
- "./initdb.d:/docker-entrypoint-initdb.d"
environment:
MYSQL_DATABASE: app_name
MYSQL_ROOT_PASSWORD: password
Dockerfile
FROM php:7.3-apache
RUN apt-get update \
&& apt-get install -y zip unzip vim libpq-dev \
&& docker-php-ext-install pdo_mysql pdo_pgsql
# xdebug
RUN pecl install xdebug && docker-php-ext-enable xdebug
COPY php-base.ini $PHP_INI_DIR/conf.d/
COPY httpd-base.conf /etc/apache2/sites-available/laravel.conf
RUN a2dissite 000-default.conf && a2ensite laravel.conf && a2enmod rewrite
# composer
RUN curl -sS https://getcomposer.org/installer | php && mv composer.phar /usr/local/bin/composer
# node
RUN apt-get install -y nodejs npm && npm install n -g && n 14.15.3
php-base.ini
php-base.ini
[Date]
date.timezone = "Asia/Tokyo"
[mbstring]
mbstring.internal_encoding = "UTF-8"
mbstring.language = "Japanese"
php.ini
php.ini
; PHPSTORMでデバッグを有効にする場合
;xdebug.idekey=PHPSTORM
xdebug.mode=debug
xdebug.start_with_request=yes
; ホスト側のIP
xdebug.client_host=host.docker.internal
; デバッグ用のポート番号（デフォルトは9003）
xdebug.client_port=9003
; ログの出力場所
xdebug.log=/tmp/xdebug.log
.env
DB_CONNECTION=mysql
DB_HOST=db
DB_PORT=3306
DB_DATABASE=app_name
DB_USERNAME=root
DB_PASSWORD=password
Xdebugでブレークポイントを打ってステップ実行する方法
VSCodeの場合
準備
- 拡張機能PHP Debugをインストール
-
launch.jsonのconfigurationsに以下の項目を追記する
"pathMappings"には"docker上のdocument root":"ローカルのdocument root"と入力するようにしてください
"configurations": [
{
"name": "XDebug on Docker",
"type": "php",
"request": "launch",
"port": 9003,
"pathMappings": {
"/var/www/html":"/Path/to/your/local/root" // "docker上のdocument root":"ローカルのdocument root"
}
}
]
使い方
-
$ docker-compose upでコンテナを起動 実行ボタンをクリック
先ほどlaunch.jsonに追加した
configurationsを選択
任意の行でブレークポイントを打つ
実行ボタンをクリックする
バーが出現する
ブレークポイントを打たれた行がphpで実行されると、停止し、ステップ実行が可能になる
PHPStormの場合
PHPStormは何かと面倒だった。
準備
-
設定 > 言語 & フレームワーク > PHP > デバッグを選択 -
php.iniに記述したポート番号を指定(今回は9003)
-
設定 > 言語 & フレームワーク > PHP > サーバーを選択 - +（追加）ボタンをクリック
- 名前とホストは適当なものを入力(今回は
Docker-xdebugとdockr-debug-hostとした) - ポートには
php.iniに記述したポート番号を指定(今回は9003) - デバッガーは
Xdebugを選択 -
「パスマッピングを使用する」にチェック -
/var/www/htmlと入力
- ツールバーの🔽をクリックし、
「実行構成の編集」を開く
- +(追加)ボタンをクリックし、
「リモートデバッグ」をクリック - 名前には適当なものを入力(今回は
Xdebug-Dockerとした) - サーバーには 3.で作成したものを選択
-
「IDEキー」にはphp.iniに入力したxdebug.idekeyを入力(今回はPHPSTORM`を入力)
-
php.iniのxdebug.idekeyのコメントアウトを外す
php.ini
; ↓コメントアウトを外す
xdebug.idekey=PHPSTORM
xdebug.mode=debug
xdebug.start_with_request=yes
; ホスト側のIP
xdebug.client_host=host.docker.internal
; デバッグ用のポート番号（デフォルトは9003）
xdebug.client_port=9003
; ログの出力場所
xdebug.log=/tmp/xdebug.log
実行
- 任意の行にブレークポイントを打つ
- デバッグボタンをクリック
- ブレークポイントを打った行が実行されると、停止し、ステップ実行が可能になる
