SXA CLI の監視、(再) 構築、およびアップロードのタスク

概要

SXA CLI のグローバル タスクを使用します。

SXA を使用すると、開発者はアセットを構築して、これらのアセットを SXA CLI を使用してローカルでアップロードするか、CI サーバーを使用してアップロードできます。このトピックでは、ファイルを監視、(再) 構築、およびアップロードするタスクについて説明します。

構築タスク

テーマ アセットを作成してアップロードするには、次のタスクを使用します。

sxa build [taskName]

エイリアス:

sxa b

追加できるオプション:

  • d, --debug - 追加のデバッグ情報を提供します。

次の表では、グローバルな (再) 構築タスクについて説明します。

グローバル タスク

説明

build All

sass フォルダーのルートから sass を CSS にコンパイルします。

build SassStyles

次のファイルを styles/styles.css にコンパイルします。

  • sass/styles/common

  • sass/styles/content-alignment

  • sass/styles/layout

build Css

styles フォルダー内のファイルをバンドルして最小化します。

build Eslint

scripts フォルダー内のすべての JavaScript に対して eslint を実行します。

build Js

scriptsフォルダー内の JavaScript ファイルをバンドルして最小化します。

build Styles

sass コンポーネントを CSS にコンパイルし、CSS ファイルをバンドルして最小化します。

build SpriteFlag

フラグ用のスプライトを作成します。

再構築タスク

テーマ アセットを再構築してアップロードするには、次のタスクを使用します。

sxa rebuild [taskName]

エイリアス:

sxa r

追加できるオプション:

  • -p, --password - アップロード用のパスワードを入力します。

  • -l, --login - ログインしてアップロードします。

  • -d, --debug - 追加のデバッグ情報を提供します。

次の表では、グローバルな再構築タスクについて説明します。

タスク

説明

すべてを再構築

[en] Compiles sass components into CSS, minifies JavaScript and CSS, uploads JavaScript, CSS, and images.

主要部分を再構築

sass コンポーネントを CSS にコンパイルし、JavaScript と CSS を最小化してアップロードします。

アップロード タスク

テーマ設定に基づいてテーマアセットをアップロードするには、次のタスクを使用します。

sxa upload [taskName]

エイリアス:

sxa u

追加できるオプション:

  • -p, --password - アップロード用のパスワードを入力します。

  • -l, --login - ログインしてアップロードします。

  • -d, --debug - 追加のデバッグ情報を提供します。

次の表では、グローバルなアップロード タスクについて説明します。

タスク

説明

upload All

JavaScript、CSS、および画像を Sitecore インスタンスにアップロードします。

upload Css

テーマ設定に基づいて styles フォルダーから CSS ファイルをアップロードします。

upload Js

テーマ設定に基づいて scripts フォルダーから JavaScript ファイルをアップロードします。

upload Img

画像フォルダーからファイルを Sitecore インスタンスにアップロードします (Sass と CSS の場合)。

upload GulpConfig

config フォルダーをアップロードして、gulpfile.js をアップロードします。

監視タスク

テーマ アセットの変更を監視し、変更されたファイルを自動的にアップロードするには、次のタスクを使用します。

sxa watch [taskName]

エイリアス:

sxa w

追加できるオプション:

  • -p, --password - アップロード用のパスワードを入力します。

  • -l, --login - ログインしてアップロードします。

  • -d, --debug - 追加のデバッグ情報を提供します。

次の表では、グローバルな監視タスクについて説明します。

タスク

説明

sxa watch All

次のタスクの機能を集約します。watch Sass、watch JS、watch Es、watch Css、watch Img、watch SassSource、watch Scriban、watch Html。

watch Sass

次のタスクのリストを実行します。watch SassComponents、watch SassBase、watch SassStyles、watch SassDependency。

sxa watch SassStyles

styles/styles.css への変更を監視し、すべての変更を以下のフォルダーにコンパイルします。

  • sass/styles/common

  • sass/styles/content-alignment

  • sass/styles/layout

watch SassBase

変更を監視し、コンポーネントとスタイルを以下のフォルダーにコンパイルします。

  • sass/abstracts/

  • sass/base/

  • sass/components

watch SassComponents

sass フォルダーのコンポーネント スタイルの変更を監視し、すべての変更を styles フォルダーにコンパイルします。

watch SassDependency

sass/styles/ (sass/styles/common、sass/styles/content-alignment、sass/styles/layout を除く) の変更を監視し、適切なコンポーネントをコンパイルします。

watch SassSource

sass フォルダーの変更を監視し、変更されたファイルをサーバーにアップロードします。

watch Css

styles フォルダー内の CSS ファイルの変更を監視し、変更されたファイルをサーバーにアップロードします。

watch Js

scripts フォルダー内の JavaScript ファイルの変更を監視し、変更されたファイルをサーバーにアップロードします。

watch Es

sources フォルダー内の JavaScript ファイルの変更を監視し、変更されたファイルをサーバーにアップロードします。

watch Html

HTML ファイルの変更を監視し、変更されたファイルをサーバーにアップロードして、Creative Exchange で解析します。

watch Scriban

Scriban ファイルの変更を監視し、変更されたファイルをサーバーにアップロードします。

watch Img

images フォルダーの変更を監視し、変更されたファイルをサーバーにアップロードします。