0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

@wordpress/envを使ってみた

Posted at

ローカルでの開発をするのに、@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で設定したら失敗しました。
ローカルの場合は、フォルダの指定になるようです。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?