The SXA CLI watch, (re)build, and upload tasks

Abstract

Use global tasks for SXA CLI.

SXA lets developers build assets and upload them either locally using SXA CLI or with CI servers. This topic describes the tasks to watch, (re)build, and upload files.

To build and upload theme assets, use the following task:

sxa build [taskName]

alias:

sxa b

Possible addition:

  • d, --debug - to provide additional debugging information.

The following table describes the global (re)build tasks:

Global task

Description

build All

Compiles sass into CSS from the root of the sass folder.

build SassStyles

Compiles the following files to styles/styles.css:

  • sass/styles/common

  • sass/styles/content-alignment

  • sass/styles/layout

build Css

Bundles and minifies the files in the styles folder.

build Eslint

Runs eslint for all JavaScript in the scripts folder.

build Js

Bundles and minifies JavaScript files in the scripts folder.

build Styles

Compiles sass components into CSS and bundles and minifies CSS files.

build SpriteFlag

Creates sprite for flags.

To rebuild and upload theme assets, use the following task:

sxa rebuild [taskName]

alias:

sxa r

Possible additions:

  • -p, --password - to enter a password for uploading.

  • -l, --login - to login for uploading.

  • -d, --debug - to provide additional debugging information.

The following table describes the global rebuild tasks:

Task

Description

rebuild All

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

rebuild Main

Compiles sass components into CSS, minifies JavaScript and CSS, uploads JavaScript, and CSS.

To upload the theme assets based on the theme configuration, use the following task:

sxa upload [taskName]

alias:

sxa u

Possible additions:

  • -p, --password - to enter a password for uploading.

  • -l, --login - to login for uploading.

  • -d, --debug - to provide additional debugging information.

The following table describes the global upload tasks:

Task

Description

upload All

Uploads JavaScript, CSS, and images to the Sitecore instance.

upload Css

Uploads CSS files from the styles folder based on the theme configuration.

upload Js

Uploads JavaScript files from the scripts folder based on the theme configuration.

upload Img

Uploads files from the images folder to the Sitecore instance. For Sass and CSS.

upload GulpConfig

Uploads config folder and uploads gulpfile.js.

To watch theme asset changes and upload the modified files automatically, use the following task:

sxa watch [taskName]

alias:

sxa w

Possible additions:

  • -p, --password - to enter a password for uploading.

  • -l, --login - to login for uploading.

  • -d, --debug - to provide additional debugging information.

The following table describes the global watch tasks:

Task

Description

sxa watch All

Aggregates the functionality of the following tasks: watch Sass, watch JS, watch Es, watch Css, watch Img, watch SassSource, watch Scriban, watch Html.

watch Sass

Runs a list of tasks: watch SassComponents, watch SassBase, watch SassStyles, watch SassDependency.

sxa watch SassStyles

Monitors changes and compiles all changes to styles/styles.css in the following folders:

  • sass/styles/common

  • sass/styles/content-alignment

  • sass/styles/layout

watch SassBase

Monitors changes and compiles components and styles in the following folders:

  • sass/abstracts/

  • sass/base/

  • sass/components

watch SassComponents

Monitors changes in component styles in the sass folder and compiles them to the styles folder.

watch SassDependency

Monitors changes in sass/styles/ (except for sass/styles/common, sass/styles/content-alignment , sass/styles/layout) and compiles appropriate components.

watch SassSource

Monitors changes in the sass folder and uploads changed files to the server.

watch Css

Monitors changes of CSS files in the styles folder and uploads them to the server.

watch Js

Monitors changes of JavaScript files in the scripts folder and uploads them to the server.

watch Es

Monitors changes of JavaScript files in the sources folder and uploads them to the server.

watch Html

Monitors changes of HTML files and uploads them to the server to be parsed by Creative Exchange.

watch Scriban

Monitors changes of Scriban files and uploads them to the server.

watch Img

Monitors changes in the images folder and uploads the files to the server.