Automatically update Sass

I have started using Sass instead of CSS for web development. However, running a command to compile the CSS files after every change got tedious fast:

sass sass/style.scss public/style.css

Luckily, there’s a better way: you can have Sass watch for changes to any of the SCSS files referred to by your main SCSS file:

sass --watch sass/style.scss public/style.css

This means it will sit in a terminal window (you will probably want to have one open specially) and will build your CSS file for you every time you save a file. (It’s a bit like nodemon, but for CSS.) It prints out the result of the operation every time so you know it’s doing something; success gives:

Compiled sass/style.scss to public/style.css.

Error messages are given if the SCSS code contains errors.

Now that I can tell Sass to watch out for changes to the source files, I can make all the changes I want and not have to worry about it. All I have to do now is refresh the webpage. Sorted.

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.