ラボラジアン 1. はじめに
WordPress のブロックを開発する際の注意点について書きます。
2. 今回、前提とする環境
今回の内容は、以下の環境を前提とします。
- Windows 10
- WSL2 の Ubuntu 20.04.2 LTS
- こちらのターミナルから Docker を利用します。
- Docker Desktop v4.1.1
また、Ubuntu 上で Node.js, npm の @wordpress/env パッケージは導入してあるものとします。
3. create-block して wp-env start する際の注意点
公式のチュートリアルなどでは、ブロックを開発する最初の段階、すなわち「ブロックの開発環境を準備する」ための操作として以下の手順が記載されています。
- @wordpress/create-block パッケージを使って、ブロックプラグインの雛形ディレクトリを生成する。
- ターミナル上でそのディレクトリに移動して「wp-env start」コマンドを実行し、ローカルにWordPressサイトを稼働させる。(Docker 内にWordPressサイトが構築されるが、ブロックプラグインは Dockerの外のまま利用できる）
公式のチュートリアルも含めて、ここの実際の手順が説明不足だったりしますので、1つ1つのコマンドについて順番に説明します。
(1) @wordpress/create-block パッケージを使って、ブロックプラグインの雛形ディレクトリを生成します。ここでは、プラグインのディレクトリ名を「my-block」にしています。
npx @wordpress/create-block my-block
(2) 生成したディレクトリに移動します。
cd my-block
(3) プラグインのファイルとディレクトリのパーミッションを変更します。（ポイント！）
Docker 側からこのディレクトリにアクセスできるようにパーミッションを緩くします。
chmod -R a-x,go-wx,u+w,a+rX .(4) Docker 側に WordPress サイトを構築させます。
wp-env start以下のように表示されたら成功です。
