Integrate Sass into your Maven build cycle

Sass is coder’s dream to cope with all styling aspects. Wouldn’t it be nice to integrate it into a Apache Maven build cycle? Oh boy, yes it would. It’s simple and works quite stable.

What a buzzword-filled header. But it’s true. Sass (.sass, .scss) and Maven are the tools of choice to make your live as an Frontend-Backend-Developer(^) simple as possible.

(^) You work as a layer between a web service and the Webdesigner dudes. I’m the C in the MVC-pattern. Hopefully.

Sass gives you – as a Coder not as a Designer – opportunities to generate a highly nested, multi-browser-compatible and working cascading stylesheets code.

If you add variables, functions, inheritance and much more to stylesheets, you’ll get Sass. In short, Sass is a extremely pimped Css.

On the other hand. Maven is the default build cycle management tool for modern Java applications. In the early days there were parameterized build scripts, now there is Maven. It helps you to resolve dependencies with a build in package manager (like NuGET), to build, to test, to verify and to deploy your application.

Now, in three simple steps, you can also integrate your Sass watcher to your Maven build process. What a wonderful thing!

First, you go to developer.jasig.org to get the related Maven dependency for your pom.xml. After a mvm:install, you have a new plugin installed with the goals: „sass:update-stylesheets“ which compiles your .scss to, css instantly and the other one „sass:watch“ which attaches a file-based watcher deamon on your .scss-files and generates the equivalent .css-files on change (with a short delay of ~ 2 minutes).

Sass-Maven-Plugin

As a proof that it is really simple, I’ve recored a short video how to use it with Apache Tapestry.

So long, enough is enough. I wish you a nice weekend and merry christmas with awesome holiday projects!

  • Tobias

Schreibe einen Kommentar

Trage deine Daten unten ein oder klicke ein Icon um dich einzuloggen:

WordPress.com-Logo

Du kommentierst mit Deinem WordPress.com-Konto. Abmelden / Ändern )

Twitter-Bild

Du kommentierst mit Deinem Twitter-Konto. Abmelden / Ändern )

Facebook-Foto

Du kommentierst mit Deinem Facebook-Konto. Abmelden / Ändern )

Google+ Foto

Du kommentierst mit Deinem Google+-Konto. Abmelden / Ändern )

Verbinde mit %s