wp-envでWordPress開発環境迷子に終止符を

開発環境のアップデートを致しましょう。

こんにちは、みみです。

最近はペライチなdocker composerでお手軽WordPressローカル環境を作成していたのですが、WordPress公式がwp-envライブラリを仕上げてきていたので、喜んでいそいそ引っ越しをしました、其のメモです。

こんな記事より先に読むべき公式ドキュメントはこちら

あとdockerが必要です。

インストール

$ npm -g i @wordpress/env

macなら ~/.wp-env/ というディレクトリが出来ていると思います。

取り敢えずデフォルトのWordPressを立ち上げるなら

適当なディレクトリを作成して

$ mkdir YOU_LIKE_DIR_NAME
$ cd YOU_LIKE_DIR_NAME

.wp-env.json というファイルを作成して、ファイルの中に以下のJSONを書いて保存。

{
    "core": null
}

以下のコマンドを叩くと、http://localhost:8888 でWordPressが立ち上がります。

$ wp-env start

簡単!

.wp-env.jsonを用意せずに、WordPressのpluginsまたはthemesディレクトリで叩いても立ち上がるようになっているみたいです。だから、wp-cliとかでWordPressをDLしてpluginsのディレクトリまで移動してwp-env startでも立ち上がります。下記追記で訂正と追加説明があります

ただ、デフォルトではdockerコンテナ内のWordPressが立ち上がっているだけで、DLしたWordPressを起動しているわけではないので、上記のように一個JSON用意したほうが楽な気がします。間違ってたらごめんなさい。

トラブルシューティング?

dockerを前から(知らぬ間に)酷使していて、くじらさんが忙しすぎたり調子が悪かったりすると、wp-env startですでにエラーかまされるかもしれませんので、其の場合は docker ps してみたり、docker再起動や全消しやらを自己責任で試してみてくださいね。

プラグイン開発なんかに超便利

さて、さくっと1コマンドでローカル環境が立ち上がる事自体が便利なのですが、もともと、wp-envはGutenberg開発のために作られたものなので、プラグイン・テーマの開発時にとても重宝するライブラリだと思います。

.wp-env.json に以下のように記述しておけば、好きなポート番号で立ち上げてWordPress本体を管理せずに、テーマとプラグインだけ作れば良いということに。あとデフォルトでデバックモードがオンになっていますので一々設定変えなくていいです。

詳しくは公式ドキュメントをどうぞ。

どうしてもローカルのWordPressで立ち上げたい場合

wp-envの良さは、WordPress本体を持たなくていいところな気がするのですが、どうしても本体ごと管理しなきゃいけないケースがあるかもしれません(今の案件がそうです)。

wp-envにはもちろん好きなWordPress環境を設定できるように、"core"の設定値で開発版のWordPressとか、ローカルのWordPressを指定することができます。

折角だし使ってみたいし、configの中身書き換えるだけだからやってみようかな、と調子に乗って軽い気持ちで設定を始めたら見事にハマったので、書いておきます。

ホスト名で迷子

生成されたサーバーのdocker-composer.ymlは、前述の~/.wp-env/ というディレクトリ内にハッシュ値のディレクトリが生成されていて、其の中に作成されていますし、特にDB名とか別に設定したわけではないので、デフォルトの設定箇所をチェックすれば設定値がわかるはず、と思って元を探したのですが。

https://github.com/WordPress/gutenberg/blob/4857ad58c1241b3d63d21a6880c989b85746c3dc/packages/env/lib/create-docker-compose-config.js#L25

特にホスト名が設定されていないのでした。省エネ設計。

というわけで、IP取らねばならんのか、と思って、

$ docker exec -it [自動生成のハッシュ値]_mysql_1 bash
$ root@c5bad2f690f7:/# hostname -i

とかしてみたんですが、リブートしたらIP変わるんですよね。無意味。dockerだもの。だから結局、ホスト名は[自動生成のハッシュ値]_mysql_1 になります。下記追記で訂正と追加説明があります)というわけで、wp-config.php はこうなりました。

//前略
** The name of the database for WordPress */
define( 'DB_NAME', 'wordpress' );

/** MySQL database username */
define( 'DB_USER', 'root' );

/** MySQL database password */
define( 'DB_PASSWORD', '' );

/** MySQL hostname */
define( 'DB_HOST', 'mysql' );
//後略

ハッシュ値はリブートでは変わらないのでこれで大丈夫なのですが、確かイメージを削除したりしたら変わると思います。

以上、色々試して、出来ることは出来たんですが、これやるなら素直に自分でdocker-composer.ymlを用意したほうがいい気もしました。でも、いずれそのための設定値とか増えたりしそうな気もするので、アップデートに期待。だれかプルリクお願いします()。

こんなふうにWordPress本体込みにしたかったりすると、公式ドキュメントのコマンドだけだと困ると思うので、docker ps とか docker rm あたりの基本は必要になってくるかも。「docker 入門」とかでググると色々情報があると思います。ちなみに私はdockerよく分からん勢なので話半分にしておいてくださいね。

昨日(2020/03/04)知って、わーっとやってみた内容なので、間違ってるぞ!てところがあったら優しくご指摘お待ちしております。

参考URL:


2020/03/05 15:20 追記

そもそも、Wockerという素敵な開発環境構築ツールもあるよ!そしてカイトさん速攻PR入れてる流石っす…
あと、cliのイメージがあるのでなんだろうなー(まいっかスルー)と思ってたらとろゆにセンセがコマンド見っけてくれました。おふたりとも多謝。


15:39 追記

wp-cliの仕組みについて、カイトさんの解説。

だから、ちょっとだけcliの実行処理に時間がかかるっぽいです。ほうほう。


2020/03/17 16:18追記

@atachibanaさんからご指摘いただいての訂正と、日本語翻訳版のお知らせです。

日本語翻訳版: @wordpress/env – Japanese Team — WordPress.org

持つべきものは友、WordPressのコミュニティに参加しててよかったなあと思うのはこういう時ですね。有難うございます!

上記で .wp-env.json 用意しない場合の話を書いたのですが、ちょっと違ったので訂正しておきます。私がテストした時は何か不具合が起きていたみたいでエラーがでちゃったんですが、やっぱり原文通り、「各プラグインディレクトリ・テーマディレクトリ直下」で wp-env start するだけで本来は立ち上がるみたいです。

あと、DBの設定値ですが、ハッシュ値とか要らずに mysql のみで走りました。これも試したはずなんだけど他が何か間違えてたんでしょうね。

あとは、DBのsaveが効くように訂正されたバージョンに早く切り替わるのを首を長くして待っております…もうマージはされているんだけどnpmがアップデートされないのですよね…

この記事を書いた人

mimi

主に書いている人。愚痴が多いです。悲観的。
フロントエンド側のアレコレをイジるのが好きみたいです。
編み物と写真と珈琲とオヤツ作りが趣味。
イラストも、最近描いてないけど描きます。
Twitter