- With the package file in place,…and the project clearly defined,…we can now start installing the actual…packages we'll be using.…So Grunt, Sass and so on.…And we'll do that in exact same way we did…previously in the previous chapter,…by using npm.…So first I need to install Sass, then watch,…and then I'm also going to install something…called autoprefixer, which I'll explain a little bit later.…So I'll start by saying npm install grunt…contrib sass--save-dev.…

So this is exactly the same function as we used before…and the function will install grunt contrib sass…and also grunt inside my _sass folder.…So I'll run the command,…you'll notice here that the node modules folder was created.…And you also see down here at the bottom of…my package.json file I now have devDependencies,…grunt and grunt contrib sass.…If I go into node modules,…we have the grunt folder and the grunt contrib sass folder,…so this is the same as what we saw in the previous chapter.…

Author

Released

4/28/2015

If you want to use CSS, and less of it, when building WordPress themes or plugins, you should be using Sass. Sass is the adopted and widely supported CSS compiler for WordPress, which allows you to use variables, mixins, and nesting to write simpler code. In this course Morten Rand-Hendriksen covers practical workflows for incorporating Sass into the development of a WordPress theme, along with Grunt.js, a task runner that translates Sass code into browser-friendly CSS. First Morten walks the viewer through a full production setup, including implementation of version control, Grunt.js, Ruby, and Sass on Windows and Mac. Then he'll present practical workflows for developing a custom theme (based on the _s or Underscores theme) with Sass and shipping "pure CSS" versions to the public.

Note: This course doesn't teach Sass itself. To learn more about the language, watch CSS with LESS and Sass.