1. テーマ

CSSテーマとJavaScriptを事前に最適化しましょう

Version:
日本語翻訳に関する免責事項

このページの翻訳はAIによって自動的に行われました。可能な限り正確な翻訳を心掛けていますが、原文と異なる表現や解釈が含まれる場合があります。正確で公式な情報については、必ず英語の原文をご参照ください。

SXAは、組み込みのテーマツールを使ってフロントエンドの開発者マシンで最適化されたファイルを構築できます。これにより、Sitecoreインスタンス外でpre-optimized-minファイルを生成でき、資産をより細かくコントロールできます。

最適化はすべてフロントエンド開発中に行うことができます。この仕組みにより、テーマファイルをGitのようなリポジトリに保存し、バージョントラッキングが可能になります。テーマファイルはシリアル化されたアイテムとして保存されず、内容もエンコードされないため、統合が容易になります。また、異なる開発者が同じテーマに同時に取り組むことも可能です。

!注デフォルトでは、設定は事前最適化を推奨しており、ソースCSSやJSのアップロードはしません。デフォルト設定を変更するには、config.jsファイルへ行ってください:/gulp/config.js。

スタイルやスクリプトのアップロードにpre-optimized-minファイルを使用するには:

  1. SXA CLIを使って新しいテーマを作成します。すべてのスクリプトとスタイルのアセットは自動的にローカルのテーマフォルダにダウンロードされます。

  2. npm installを使い、gulp watcherタスクを実行し てください。

  3. スタイルやスクリプトを変更すると、pre-optimized-minファイルが自動的に作成され、Sitecoreインスタンスにアップロードされます。

    例えば、アコーディオンコンポーネントのスタイルを変更して保存すると、ソースが別々にアップロードされているのではなく、pre-optimized-minファイルを使ってアップロードされたことが表示されます。

    Uploading of pre-optimized-min was successful message.

    コンテンツエディターでは、テーマのstyleやscriptsフォルダにはpre-optimized-minファイルのみが入り、ソースアセットは含まれません。

    The theme folder contains the pre-optimized-min folder only.
この記事を改善するための提案がある場合は、 お知らせください!