CSS テーマと JavaScript の事前の最適化
このページの翻訳はAIによって自動的に行われました。可能な限り正確な翻訳を心掛けていますが、原文と異なる表現や解釈が含まれる場合があります。正確で公式な情報については、必ず英語の原文をご参照ください。
SXA では、組み込みのテーマ ツールを使用して、フロントエンドの開発者のマシンで最適化されたファイルを作成できます。これにより、Sitecore インスタンスの外部で pre-optimized-min
ファイルが作成され、アセットをより詳細に制御できます。
フロントエンドの開発時にすべての最適化を行うことができます。この方法では、テーマ ファイルを Git などのリポジトリに保存して、バージョンを追跡することができます。テーマ ファイルはシリアル化されたアイテムとして保存されず、コンテンツはエンコードされないため、テーマ ファイルのマージが容易になります。また、異なる開発者が同じテーマで同時に作業することもできます。
デフォルトでは、設定により事前の最適化の使用が推奨されており、ソースの CSS や JS はアップロードされません。デフォルトの設定を変更するには、config.js
ファイル (<Theme>/gulp/config.js
) に移動します。
pre-optimized-min
ファイルを使用してスタイルとスクリプトをアップロードするには、次の手順に従います。
-
SXA CLI を使用して新しいテーマを作成します。すべてのスクリプトとスタイルのアセットがローカルのテーマ フォルダーに自動的にダウンロードされます。
-
スタイルまたはスクリプトを変更すると、
pre-optimized-min
ファイルが作成され、Sitecore インスタンスに自動的にアップロードされます。たとえば、アコーディオン コンポーネントのスタイルを変更して保存すると、ソースが個別にアップロードされるのではなく、
pre-optimized-min
ファイルを使用してアップロードされるというメッセージが表示されます。コンテンツ エディターでは、テーマの styles フォルダーと scripts フォルダーには、ソースのアセットではなく、
pre-optimized-min
ファイルのみが含まれています。