Automated optimized project development workflow. A tool, introduction and configuration for Grunt.
GET YOUR PROJECT QUICKLY OFF THE GROUND
To get up and running, follow these instructions:
- Download or Clone the repo
git@github.com:tsvensen/Takeoff.git
- Open up a terminal window and cd into the project directory
- Make sure the Grunt command line tools are installed globally, if not run
npm install grunt-cli -g
- Enter the following to install:
npm install
(If there is an error, trysudo npm install
) - Then run:
grunt watch
- To end the
grunt watch
process, press CTRL-C in the terminal window. To manually publish with grunt, in the terminal simply run:grunt
- Update the file paths of the last two lines in the
<head>
for icons.fallback.css and lte-ie7.js
Now you are ready for developming and making updates. Do not edit the .css files (/css/processed/), instead update the .scss files (/css/sass/). For Javascript, edit the files in the js/custom directory.
This workflow will use grunt to watch the scss and js files for changes then lint/compile them. If there are errors in the code, publishing will fail. Refer to the console for the line number.
grunt
orgrunt default
to run the default Takeoff taskgrunt watch
to automate optimization while buildinggrunt cleanup
to remove all processed Sass CSS files, run after adding or changing .scss files. Run occasionally and before deployinggrunt icons
to build SVG images with PNG fallbacksgrunt minify
to use Yahoo!'s SmushIt service to minify images
Created by Tim Svensen (follow @tsvensen)
Remember, this is a start. From here you can mold and shape it to fit your approach.
Author & copyright (c) 2012: Tim Svensen, Dual MIT & GPL license
Copyright (c) 2012 "Cowboy" Ben Alman, contributors Licensed under the MIT license.