Theme Gulp Tasks

Theme projects that use the liferay JS Theme Toolkit, such as those created with the Liferay Theme Generator have access to several gulp tasks that you can execute to manage and deploy your theme.

Here are the gulp tasks you can execute:

  • build: generates the base theme files, compiles Sass into CSS, and zips all theme files into a WAR file that you can deploy to a Liferay server.

  • deploy: runs the build task and deploys the WAR file to the configured local app server.

  • extend: allows you to specify a base theme or themelet to extend. By default, themes created with the Liferay Theme Generator are based off of the styled theme.

    You first are prompted if you want to extend a Base theme or Themelet, then you’re prompted for where you would like to search for modules. Selecting Globally installed npm modules searches globally accessible npm modules on your computer. Selecting npm registry searches for published modules on npm. If you have v8.x.x of the Liferay JS Theme Toolkit installed, you can also Specify a package URL to locate a themelet.

    After you’ve selected modules from the options it provides, the modules are added to your package.json file as dependencies. Run npm install to install them.

  • kickstart: allows you to copy the CSS, images, JS, and templates from another theme into the src directory of your own. While this is similar to the extend task, kickstarting from another theme is a one time inheritance, whereas extending from another theme is a dynamic inheritance that applies your src files on top of the base theme on every build.

  • init: prompts you for local and remote app server information to use in theme deployment.

  • status: displays the name of the base theme/themelets your theme extends.

  • watch: allows you to preview the changes you make to your theme without requiring a full redeploy. After invoking the watch task, every time you save any changes to a file in your theme, applicable changes are compiled and they’re copied directly to a proxy port (e.g. 9080) for you to preview live. Note: you must have Developer Mode enabled to use the watch task. Once you’re happy with the live preview, deploy your theme to apply the changes.

Related Topics

Liferay Theme Generator

« Classes Moved from portal-service.jarTheme Reference Guide »
¿Fue útil este artículo?
Usuarios a los que les pareció útil: 0 de 0