03

grunt-steps : 03 - advanced (pt-Br)

Advanced usage of Grunt

• grunt plugins loaded with jit-grunt at Gruntfile.js line 8
• grunt tasks settings defined at Gruntfile.js lines 14-27
  • split grunt config into per-task files on ./grunt/config_task directory and loaded at Gruntfile.js line 25
  • project main settings centralized on ./grunt/config.js and added to grunt settings at Gruntfile.js line 20
• grunt custom tasks defined at Gruntfile.js lines 29-93
• grunt main and default tasks at Gruntfile.js lines 75-91

Prerequisites

• Must have Git installed

• Must have node.js (at least v0.10.x) installed with npm (Node Package Manager)

• Must have Grunt.js CLI node package installed globally. sudo npm install -g grunt-cli

• Must have bower node package installed globally. sudo npm install -g bower

Installation Guide

Enter the following commands in the terminal

git clone https://github.com/soudev/grunt-steps.git
cd grunt-steps/03
npm install

Commands

run grunt

npm start

Grunt.js

• development workflow

grunt

• build (production version)

grunt release

• preview builded

grunt preview

Commands on Mac

Create commands list

npm init

npm install \
  jshint-stylish \
  time-grunt \
  jit-grunt \
  grunt \
  grunt-contrib-watch \
  grunt-contrib-clean \
  grunt-contrib-copy \
  grunt-contrib-concat \
  grunt-contrib-uglify \
  grunt-contrib-htmlmin \
  grunt-contrib-cssmin \
  grunt-contrib-jshint \
  grunt-lintspaces \
  grunt-newer \
  grunt-browser-sync \
  grunt-filerev \
  grunt-usemin \
  --save-dev

touch Gruntfile.js

bower init

bower install \
  jquery \
  --save

Links

• jQuery

--

• Grunt.js

  • Grunt.js : Configuring Tasks - templates

  • [GitHub] sindresorhus / time-grunt - Display the elapsed execution time of grunt tasks

  • [GitHub] shootaroo / jit-grunt - JIT(Just In Time) plugin loader for Grunt.

  • [GitHub] gruntjs / grunt - Grunt: The JavaScript Task Runner

  • [GitHub] gruntjs / grunt-contrib-watch - Run tasks whenever watched files change.

  • [GitHub] gruntjs / grunt-contrib-clean - Clear files and folders.

  • [GitHub] gruntjs / grunt-contrib-copy - Copy files and folders.

  • [GitHub] gruntjs / grunt-contrib-concat - Concatenate files.

  • [GitHub] gruntjs / grunt-contrib-uglify - Minify files with UglifyJS.

  • [GitHub] gruntjs / grunt-contrib-htmlmin - Minify HTML.

  • [GitHub] gruntjs / grunt-contrib-cssmin - Compress CSS files.

  • [GitHub] gruntjs / grunt-contrib-jshint - Validate files with JSHint.

  • [GitHub] schorfES / grunt-lintspaces - A Grunt task for checking spaces in files.

  • [GitHub] tschaub / grunt-newer - Configure Grunt tasks to run with newer files only.

  • [GitHub] BrowserSync / grunt-browser-sync - Grunt Task for keeping multiple browsers & devices in sync when building websites.

  • [GitHub] yeoman / grunt-filerev - File revving

  • [GitHub] yeoman / grunt-usemin - Replaces references to non-optimized scripts or stylesheets into a set of HTML files (or any templates/views)

    • grunt-usemin | Grunt Tasks - Automated optimization of css, js and html files.

      • [GitHub] kanakiyajay / grunt-tasks - This repo is for all the Gruntfile.js for grunt plugins

License

• MIT