PrimeVue v4への移行ガイド。
PrimeTekでは、2008年からUIコンポーネントライブラリを開発してきました。Webは技術的な進歩を続けており、その結果、関連性を維持するためにライブラリを最新化および更新する必要があります。PrimeVue v4は、最新のWeb APIを完全に採用し、レガシースタイルモードのような技術的負債を解消した次世代バージョンです。すべてのコンポーネントが見直され、強化されています。製品とコミュニティへの取り組みの一環として、PrimeVue v3は2024年末までメンテナンスを継続します。
最も注目すべき機能は、新しいスタイル付きモードの実装です。以前のイテレーションでは、primevue-sass-themeと呼ばれる外部リポジトリでSASSを使用しており、theme.cssファイルのコンパイルが必要でした。このファイルはアプリケーションに含める必要があり、ダークモードやプライマリカラーの変更などの基本的なタスクのためにランタイムで交換する必要がありました。v4では、スタイル付きモードがコアの一部となり、SASSはまったく使用されなくなり、CSS変数を利用した新しいデザイントークンベースのアーキテクチャが作成されました。新しいAPIは、レガシースタイルモードよりもモダンで優れています。
一部のコンポーネントの名前は、より一般的な代替名に変更されました。たとえば、OverlayPanelがPopoverに、InputSwitchがToggleSwitchになりました。各コンポーネントは、CSSクラス名とPTセクション間で一貫した命名になるように見直されました。例としては、クラス名にp-select-optionを使用するSelectコンポーネントのoption要素が挙げられます。
コンポーネントは他のコンポーネント内でより多く利用されるようになりました。たとえば、Dialogの閉じるボタンは実際にはPrimeVueボタンではないため、closeButtonPropsを使用して、アウトライン、レイズなどのボタンの機能を有効にすることができます。コンポーネントが別のコンポーネントを使用する場合、v3ではptセクションが混乱を招いていました。これを防ぐために、PTセクションが実際には単純なDOM要素ではなくPrimeVueコンポーネントであることを示すためにpcプレフィックスが追加されます。これは、PTがDOM要素に任意の属性を渡すことを許可する一方で、要素が実際にPrimeVueコンポーネントである場合は、propsも渡すことができるため、特に役立ちます。
下位互換性のある変更と破壊的な変更のリスト。
古い名前は非推奨ですが、引き続き機能します。代わりに、新しいインポートパスに移行してください。例:primevue/calendarはprimevue/datepickerになります。
他のコンポーネントで機能が提供されているため、非推奨になっているコンポーネント。
コンポーネントの内部変更に関する詳細情報を含むIssueチケット。
スタイル付きモードのテーマは、まったく新しいアーキテクチャに基づいてゼロから再実装されました。theme.cssとprimevue/resourcesはもう存在しないため、これらのアセットのインポートをすべて削除する必要があります。v3のカスタムテーマがあった場合は、新しいAPIを使用してテーマを再作成する必要があります。詳細については、スタイル付きモードのカスタマイズセクションを参照してください。
InlineMessageは、Messageとの重複のため非推奨になりました。Messageの間隔、closable、およびlifeプロパティには、InlineMessage機能を提供するための破壊的な変更があります。デフォルトのマージンが削除され、closableはデフォルトでfalseになり、メッセージは自動的に消えません。
実験的なPassThrough機能は本番環境に対応できていません。特定のコンポーネントのCSSクラスとの整合性のために、PTセクション名が変更されています。コンポーネント要素が別のPrimeVueコンポーネントである場合は、示すためにpcプレフィックスが追加されます。新しいAPIについては、コンポーネントのPass Throughセクションを確認してください。スタイルなしモード用のTailwind CSSプリセットは、まだv4に更新されていません。
スタイルなしモード用のTailwind CSSプリセットは、まだv4をサポートしていません。更新は開発中で、2024年7月末に予定されています。
Apolloのようなアプリケーションテンプレートはまだv4をサポートしていません。すべてのテンプレートは、新しいテーマAPIに基づく新しい機能強化とともに、2024年8月末までにv4に更新される予定です。
nuxt-primevueモジュールは、新しい@primevue/nuxt-moduleに置き換えられました。古いモジュールは、v3ユーザー向けに引き続きメンテナンスされます。