metroly

Grrr... Grunt!

When do I use it?

Use can use grunt for following things:

• running JSHint to lint files: grunt jshint (default command)

• watching files for changes (JS, CSS, images) and running JSHint grunt watch

• minifying, linting files for new releases run: grunt release

• compress files (Zip, GZip) (first modify compress option in Gruntfile) and run: grunt compress

• preprocess index.html file and the likes - make sure to check grunt preprocess plugin and the way we use it in index.html (including script tags) (from Gruntfile's processhtml task (line 110)).

• use grunt TASKNAME --debug or ```grunt TASKNAME -d`` for debugging grunt tasks that support it

How do I install grunt?

1. First install node and npm
2. Next run: npm install, which installs all necessary dependencies
3. Now you can run grunt to compile scripts!

Can I add more stuff to grunt?

Feel free to add as much of useful tasks to Gruntfile as as you can! ;p

Notes

Just a general list of dependencies we need to install additionally

npm install

npm install grunt-cli -g

npm install grunt --save-dev

npm install almond -g

CSS

In CSS folder when you want to add CSS for a new feature, just add @import 'my_new_file_name.css' instead of working in one huge file. Later we will compile it all into one big file.

References

• Node GTFS
• RequireJS Optimization options
• grunt-cssmin options
• Mobile Workflow by Addy Osmani
• Backbone Boilerplate