ここ2年くらい PrimeVue を使い続けて身に着けたことをざっくりまとめました。
- 2025/01 時点での情報になります
- この記事では PrimeVue の導入手順は紹介しません
- 書いていくうちに普遍的な内容になってしまいました
最初に読むべき情報
公式ドキュメントを読みます。
PrimeVue は昨年メジャーバージョンが v3 から v4 に変わったため現在 v3 と v4 に関する公式ドキュメントが存在します。
↓ 最新(v4)のドキュメント:https://primevue.org/
↓ v3 のドキュメント:https://v3.primevue.org/
↓ v3 から v4 への移行ガイド:https://primevue.org/guides/migration/v4/
これから新しく PrimeVue を始める場合、特に理由がなければ v4 がおすすめです。
- v3 には有るが v4 に無いといった機能はこれと言って無い(と思う)こと
- 一部 v3 に存在したコンポーネントについて名前が変わったり、統廃合が行われてはいる
- 詳しい情報は上記の移行ガイド内に書かれています
- v3 の頃はカラーモードの切り替えについてライトテーマ/ダークテーマのcssを読み込み直すといった作業が必要で、これが切り替え時の画面のチラつきの原因になっていました。。テーマに関する仕組み自体に更新が入り、v4 ではシームレスな切り替えができるようになりました
- 詳しい情報はこちら ⇒ https://primevue.org/theming/styled/
- 各コンポーネントのドキュメントについて v4 の方が充実している(Pass Through に関する情報とか特にそう)
詰まったときに読むと解決するかもしれない情報
最近はあまり起きませんが、過去 v3 の頃は稀に公式ドキュメントには記載があっても実際には動作しないといったケースがありました(具体例について忘れてしまいましたが DataTable コンポーネントのパススルーに関連した話だった気がする。。)
ちゃんと設定したはずなのにうまく動かないと思った時は GitHub の公式リポジトリ内のソースを読んだり、解決済みを含む issue を漁ったりすると話題に上がっていることもあるかもしれません。
↓ 公式リポジトリ
うまく動かなかったときに公式リポジトリ内のソースを確認する場合ですが v3 と v4 でコンポーネント・ディレクティブの置き場所が異なります。
導入している PrimeVue が v4 の場合は最新の master ブランチを見ればいいと思います。
その中でコンポーネントなど主に見るべき情報は packages/primevue/src 内に存在します。
導入している PrimeVue が v3 の場合は master ブランチではなく v3 というブランチを見ると良いと思います。その中で主に見るべき情報は components/lib 内に存在します。
その他、特定のバージョンにおける話の場合はそのバージョンのソースを確認するとより良いと思います。
リポジトリのリリース一覧画面から辿ることもできますが、以下のようなURLにアクセスすることで直接パッケージのバージョンに対応したソースへアクセスできます。
https://github.com/primefaces/primevue/tree/[primevue パッケージのバージョン]