Hot-deploy SCSS theme changes on file save

Let’s suppose you have an application up and running and you want to change its visual appearance iteratively without server restart.

Regular solution for this: change SCSS, then run deployThemes gradle task, wait for build, then go to web browser and reset cache (Ctrl-F5).

Gradle build system has a really useful feature: continuous mode.

It enables you to start build that will automatically detect changes from a file system and run again. It is really useful if you develop SCSS theme.

Start in command line:

gradlew deployThemes --continuous

You will see the following output:

Waiting for changes to input files of tasks...

Open your halo-ext.scss file (the same applies to all the SCSS files in themes) and add something (be careful, it should be valid CSS):

.demo {}

Save file (Ctrl-S).

Gradle detects changes, then automatically builds and deploys them:

new file: /home/artamonov/projects/theme-hot-build/modules/web/themes/halo/
Change detected, executing build...

2 actionable tasks: 2 executed

Waiting for changes to input files of tasks... 

Voila! You can simply refresh styles in a web browser using Ctrl-F5 shortcut.

There is no need to start deployThemes task manually after each change of CSS.