@wordpress/envを使ってみた

ローカルでの開発をするのに、@wordpress/envを使ってみました。

ドキュメント

公式ドキュメント
https://ja.wordpress.org/team/handbook/block-editor/reference-guides/packages/packages-env/

インストールの参考にしたサイト
https://tomosta.jp/blog/wp-env/

作業的には、ただただ↑に書いてあることを実行したレベルなので、ちょっとした使い方と所感を下に書いていきます。

インストール

まずは、プロジェクトのフォルダを準備し、そこに移動する。

グローバルにインストールするコマンド

npm -g i @wordpress/env

ローカルパッケージとしてのインストールコマンド

npm i @wordpress/env --save-dev

僕は、npm initして、package.jsonを作成したので、2つ目のコマンドを実行しています。
（「とりあえず」でグローバルのコマンドもやっちゃったかも）

起動

wp-env start

でWPが起動します。

http://localhost:8888/wp-admin/
にアクセスして、
ユーザー名: admin
パスワード: password
でログインできます。

—update

—updateした場合は、WP管理画面からインストールしたプラグインは消えてしまうので注意。

 npm run wp-env start —update

.wp-env.json

.wp-env.jsonを用意することで、WPインストールやプラグイン、テーマをカスタマイズできます。

とりあえず、僕は、
"core": null → 使用する WordPress のバージョンまたはビルド。null の場合、最新リリース版 ※ローカルとサーバー上でバージョン違うことにならないように注意
themes → 環境にインストールするテーマのリスト
plugins → 環境にインストール、有効化するプラグインのリスト

この3つを設定しました。

{
  "themes": [
    "./themes/xxxxx"
  ],
  "core": null,
  "plugins": [
    "https://downloads.wordpress.org/plugin/xxxxxxxx.zip",
    "./plugins/xxxxx"
    ...省略
  ]
}

※ローカルのプラグインを設定したい場合は、zipではなくフォルダを設定する

themes設定

.wp-env.jsonの、themesに設定してあるディレクトリのテーマが、WPの管理画面上に出ます。

結果

wp-configとかの設定はできなさそう（かも？）なものの、ローカルで触るのはthemes下のみでも良さそうな場合は、簡単に実装できて便利でした。

ちょっとつまづいたところは、プラグインをローカルでインストールしようとした際、downloads.wordpress.orgからは、zipで指定していたので、zipで設定したら失敗しました。
ローカルの場合は、フォルダの指定になるようです。