ckollars / grunt-starter

Starting point for commonly used grunt tasks and packages on a given website project

Grunt Starter

Common Grunt tasks used on most projects

Prerequisites

• NodeJS & NPM Node is used for running grunt tasks.
• GruntJS Grunt a Javascript task runner.

Installation

Install the set of Grunt plugins in the root folder of your project:

npm install

Inside the package.json file there is a 3 variables, bower, themeFolder & staticFolder. Set these variables to the appropriate project directory structure.

Grunt Plugins

When installing this Grunt project you will be installing these plugins:

• Grunt
• Glob
• Grunt Autoprefixer
• Grunt Contrib Clean
• Grunt Contrib Compress
• Grunt contrib Concat
• Grunt Contrib Copy
• Grunt Contrib CSSMin
• Grunt Contrib Imagemin
• Grunt Contrib SASS
• Grunt Contrib Uglify
• Grunt Contrib Watch
• Grunt Favicons
• Grunt Grunticon
• Grunt Imageoptim
• Grunt Notify
• Grunt SVGMin
• Load Grunt Tasks
• Matchdep
• Time Grunt

Grunt Tasks

icons - Runs svgmin followed by grunticon followed by cssmin followed by clean:icons.

• svgmin - Minifies SVG files in the svgs direcotry into the directory compressed
• grunticon - Builds data uri style sheets from SVGs
• cssmin - Minifies CSS files. Specificly the ones outputed from Grunticon.
• clean:icons - Cleans and deletes the compressed directory from within the svgs directroy in your theme.

fav-icons - Runs favicons.

• favicons - Creates a list of favicon images and meta tags from a logo.png within favicons directory and outputs into favicons/build.

build-styles - Runs sass:build followed by autoprefixer:build.

• sass:build - Converts sass from scss dirctory to css in the css directory.
• autoprefixer:build - Adds browser specific prefixes to the css files.

build-scripts - Runs concat:build followed by uglify:build.

• concat:build - Concatinates all the themes javascript files into one file named js/dist/compiled.js.
• uglify:build - Copy and minifies compiled.js file to js/dist/compiled.min.js.