Join Ray Villalobos for an in-depth discussion in this video Processing Sass and Compass, part of Web Project Workflows with Gulp.js, Git, and Browserify.
…It's time to process our Sass files.…It's going to be a little more intense than some of the other ones.…Remember that Sass and Compass both have additional installation requirements,…so make sure that you've watched the movie on installing requirements.…Now first, I'm going to start as before, loading up the plug-ins.…For Sass and Compass, I just need to load a single plug-in called Gulp Compass.…So I'll do an npm install, ---save-dev, and gulp-compass.…And I need to add it as a variable in our workflow, so I'm going to…copy this browserify variable here, and put it…in a compass variable, and just require the plugin.…
This will feed all the methods and properties, into this variable that…we create, and I'm going to also create a variable for our Sass sources.…Just to keep everything organized, so I'll say…Sass sources, and although we could put in…a number of different files here, the only…one that we really need is this style.scss.…So this is going to be in the components folder and…then in the Sass folder, and load up our style.scss file.…
- Why workflow management?
- Processing tasks with gulp-coffee
- Importing libraries with Browserify
- Processing Sass and Compass
- Issuing tasks in sequence
- Watching changes to files
- Adding static reloads
- Setting up environment variables
- Minifying HTML
- Compressing images