Gulp and SCSS

Gulp and SCSS

There are so many technologies out there that you can learn; it’s probably impossible to keep up with all of them. It’s still fun to try and learn a little bit about a lot of things. Perhaps we should focus on what we are good at and dabble in everything else. I recently decided to play with gulp, and I like what I saw.

In order to use gulp, you will need to install a few things, and they are listed below.

  • nodejs
  • npm (I’ll talk about yarn in another post)
  • gulp

First, you’ll need to install nodejs and can follow this tutorial. The node package manager (npm) should come with nodejs. Then you will need to install gulp by running “npm install –global gulp-cli.”

Now that you have the required packages installed, you can clone my gulplol repository. My “gulpfile.js” is configured to look for Sassy CSS files in the “scss” folder. You can run “gulp styles” to run it once or “gulp” to have it listen for changes. If it looks for changes, any time you save, it will compile your SCSS. It will also auto prefix certain non-standard CSS properties. It will minify the CSS and also add a source map to view the minified files easier.

Feel free to email me if you have any questions.