npm install -g grunt-cli
cd /path/to/gruntend npm install
Build the site:
The built site can be found at dist/
Grunt can watch the project and compile LESS and coffeescript when you make changes to the files. Grunt is setup to not minify files when watching them to aid debugging whilst in development.
Project build settings are configured in the usual
HTML5 Boilerplate diff
main.cssis renamed ->
base.less. Your base styles for all screen widths greater than 0px go in
normalize.lessto allow it to be imported inline into the compiled stylesheet
- There are extra stylesheets in for different screen widths
960.less. Styles for screen width of 320px and above go in
320.less, Styles for screen width of 768px and above go in
768.lessetc. There is also a
main.lessimports your stylesheets wrapped in the relevant @media query blocks.
ie.lessdoes the same, but doesn't use media queries.
index.htmlincludes the concatinated and minified CSS stylesheet (which includes normalise.css). lt-ie8 gets the
- 2013-05-23 v0.5.1 Uses grunt-contrib-cssmin instead of grunt-contrib-mincss, updated to firstname.lastname@example.org.
- 2013-04-29 v0.5.0 Updated to HTML5 Boilerplate@4.2.0, email@example.com firstname.lastname@example.org. Added clean task.
- 2013-03-07 v0.4.0 Updated to grunt-contrib-coffee v0.6.0
- 2013-03-01 v0.3.0 Updated to grunt-contrib-watch v0.3.1. Watch task now watches image directory as well. Added CHANGELOG file.
- 2013-02-18 v0.2.0 Grunt 0.4 support
- 2013-01-26 v0.1.0 Updated to HTML5 Boilerplate v4.1.0 and fixed issue where modernizr & jquery were not copied to output folder.
- 2013-01-18 v0.0.1 Brand new!