wp-scriptsの利用

[fumikito]

いままでgulpを利用してきましたが、wp-scriptsに移行していこうと思います。その仕様をここで決定する。

いままで

Gulpとwebpackを組み合わせ、トランスパイルしていた。webpack.config.jsはこんな感じ。

curl -L https://raw.githubusercontent.com/tarosky/workflows/main/setup.sh | bash

トランスパイルすると、JSとライセンスファイルが書き出され、ライセンスファイルにはヘッダー情報が書いてある。このファイルを @kunoichi/grab-deps を使ってパースし、 wp-dependencies.json に書き出していた。

この仕組みのよいところは以下の通り。

• 依存関係の読み込みがJSONファイルですべて読み込める。 https://github.com/tarosky/gutenberg-fust/blob/master/src/Tarosky/Fust/Bootstrap.php#L65-L85
• JSを追加するという点に関しては何も意識する必要がない（package.jsonとか触らない）
• ディレクトリ構成が保たれる

現時点での検討事項

• 依存パッケージの管理がめんどくさい。
• 初期のセットアップが大変。毎回コピペしている（この問題はこのリポジトリでも改善しうる）
• WordPressが @wordpress/scripts を改善し続けているので、そこにのっかりたい。
• 通常のJSとは別に、ブロックのように1ディレクトリ内に全部はいっているやつとではビルドプロセスを変えるべきか？　次のようなケースと、通常のテーマで使うJS（とっぷにもどるとか）が同じプロセスで処理されるのは違う気がする。
  • カスタムブロックのたくさんあるテーマ
  • ブロックライブラリ

@wordpress/scripts でできること

• JSのビルド。ただし、一括でできるかどうか、よくわからない。
• 最近はやりのscoped-css（styled-components）を使っているのだが、これを使うべき？　いままではjs, cssを別に管理していた。
• 依存関係管理用ツールとして、phpファイルが書き出される仕組みが用意されている。ただ、パースするのはめんどくさいような気がする。
• regsiter_block_assetsという関数にblock.jsonを渡すといい感じにしてくれるようだが、ぱっと見で便利そうに見えない。