My perfect front end build process.
Requires node, bower and gulp to run.
Run npm install, bower install and then gulp to run
Boy boilerplate https://github.com/corysimmons/boy
Nib (stylus utility belt)
Axis (stylus utility belt built on top of nib)
Rupture (for media queries)
Typographic (for handling type)
Lost (super flexible grid system)
PostCSS (for lost but postcss has lots of other applications including autoprefixing)
More PostCSS plugins here
Browsersync (can be configured to proxy MAMP wordpress)
Tasks (aside from the default)
Add individual SVG icons to img/icons and then run
gulp sprites to build them into a new sprite with png fallback sprite. If you have the default gulp task running in another terminal window, it will detect the resulting change and then build the new _sprite.styl file in. A browser refresh may be required for the svgs to display correctly.
gulp minifyimages will optimise any images in the img/src directory and place them in the img directory. The main gulp task will also watch for changes.
gulp favicons will build favicons for all platforms from the file img/favicon-original.png and place them in the img directory. The main gulp task will also watch for changes.