Grunt Settings

Gruntfile.js

'use strict';
module.exports = function(grunt) {
    // load all grunt tasks matching the `grunt-*` pattern
    // Ref. https://npmjs.org/package/load-grunt-tasks
    require('load-grunt-tasks')(grunt);
    grunt.initConfig({
        // Fontello Icons
        // Note: This is one time running task, so run grunt after update assets/fontello/config.json file
        // Ref. https://npmjs.org/package/grunt-fontello
        fontello: {
            dist: {
                options: {
                    config: 'assets/fontello/config.json',
                    fonts: 'assets/fontello/font',
                    styles: 'assets/fontello/css',
                    scss: false,
                    force: true
                }
            }
        },
        // Autoprefixer
        // Parse CSS and add vendor-prefixed CSS properties using the Can I Use database. Based on Autoprefixer.
        // Ref. https://www.npmjs.com/package/grunt-autoprefixer
        // autoprefixer
        autoprefixer: {
            options: {
                browsers: ['last 2 versions', '> 5%', 'ie 9', 'ios 6', 'android 4'],
                map: true
            },
            files: {
                expand: true,
                flatten: true,
                src: '*.css',
                dest: ''
            }
        },
        // SCSS and Compass
        // Ref. https://npmjs.org/package/grunt-contrib-compass
        compass: {
            frontend: {
                options: {
                    config: 'config.rb',
                    force: true
                }
            }
        },
        // Uglify
        // Compress and Minify JS files in js/rtp-main-lib.js
        // Ref. https://npmjs.org/package/grunt-contrib-uglify
        uglify: {
            options: {
                banner: '/*! \n Theme JavaScript Library */'
            },
            build: {
                src: [
                    'js/jquery.cycle2.min.js',
                    'js/jquery.cycle2.carousel.min.js',
                    'js/jquery.cycle2.swipe.min.js',
                    'js/custom-script.js'
                ],
                dest: 'js/theme-js-min.js'
            }
        },

        // Checks gettext function calls for missing or incorrect text domain.
        // Ref. https://www.npmjs.com/package/grunt-checktextdomain
        checktextdomain: {
            options: {
                text_domain: 'text-domain', //Specify allowed domain(s)
                keywords: [ //List keyword specifications
                    '__:1,2d',
                    '_e:1,2d',
                    '_x:1,2c,3d',
                    'esc_html__:1,2d',
                    'esc_html_e:1,2d',
                    'esc_html_x:1,2c,3d',
                    'esc_attr__:1,2d',
                    'esc_attr_e:1,2d',
                    'esc_attr_x:1,2c,3d',
                    '_ex:1,2c,3d',
                    '_n:1,2,4d',
                    '_nx:1,2,4c,5d',
                    '_n_noop:1,2,3d',
                    '_nx_noop:1,2,3c,4d'
                ],
                correct_domain: true
            },
            target: {
                files: [{
                    src: [
                    '*.php',
                    '**/*.php',
                    '!node_modules/**',
                    '!admin/tgm/**',
                    '!admin/ReduxFramework/*',
                    '!admin/ReduxFramework/**',
                    '!tests/**'
                    ],
                    expand: true
                }]
            }
        },

        // Internationalize WordPress themes and plugins
        // Ref. https://www.npmjs.com/package/grunt-wp-i18n
        //
        // IMPORTANT: `php` and `php-cli` should be installed in your system to run this task
        makepot: {
            target: {
                options: {
                    cwd: '.', // Directory of files to internationalize.
                    domainPath: 'languages/', // Where to save the POT file.
                    exclude: ['node_modules/', 'admin/tgm/', 'admin/ReduxFramework/'], // List of files or directories to ignore.
                    mainFile: 'index.php', // Main project file.
                    potFilename: 'text-domain.pot', // Name of the POT file.
                    potHeaders: { // Headers to add to the generated POT file.
                        poedit: true, // Includes common Poedit headers.
                        'x-poedit-keywordslist': true, // Include a list of all possible gettext functions.
                        'Project-Id-Version': 'Theme 1.0.0' // Project name and version
                    },
                    type: 'wp-theme', // Type of project (wp-plugin or wp-theme).
                    updateTimestamp: true // Whether the POT-Creation-Date should be updated without other changes.
                }
            }
        },

		// Run shell commands
		// Ref. https://www.npmjs.com/package/grunt-shell
        shell: {
            sync: {
                command: 'rsync -vzh --delete -rltgoD --exclude=.git --exclude=.phpintel --exclude=node_modules --exclude=.sass-cache --exclude=.gitignore . user@host:/path/to/server/theme/directory/'
            }
        },
        
        // Generate Sprite Image
        // https://www.npmjs.org/package/grunt-spritesmith
        sprite:{
            all: {
                'src': ['images/row/*.png'],
                'destImg': 'images/sprites.png',
                'destCSS': 'sprites.css',
                'padding': 30,
                'cssFormat': 'css'
            }
        },

        // Watch for hanges and trigger compass and uglify
        // Ref. https://npmjs.org/package/grunt-contrib-watch
        watch: {
            compass: {
                files: ['**/*.{scss,sass}'],
                tasks: ['compass', 'autoprefixer']
            },
            uglify: {
                files: '<%= uglify.build.src %>',
                tasks: ['uglify']
            },
            shell: {
                files: ['*.php', '**/*.php', 'img/*'],
                tasks: ['shell']
            },
            livereload: {
                // Here we watch the files the sass task will compile to
                // These files are sent to the live reload server after sass compiles to them
                options: {
                    livereload: true
                },
                files: ['*.css', '*.js', '*.php']
            }
        }
    });
    // Register Task
    grunt.registerTask('default', ['fontello', 'compass', 'autoprefixer', 'uglify', 'checktextdomain', 'makepot', 'watch']);
};

package.json

/* Custom grunt packages */

grunt
grunt-contrib-compass
grunt-contrib-uglify
grunt-contrib-watch
grunt-wp-i18n
load-grunt-tasks
grunt-fontello
grunt-autoprefixer
grunt-shell
grunt-checktextdomain
grunt-spritesmith

shell-command.sh

# Run following command under (local) project root folder
sudo npm install --save-dev grunt grunt-contrib-compass grunt-contrib-uglify grunt-contrib-watch grunt-wp-i18n load-grunt-tasks grunt-fontello grunt-autoprefixer grunt-shell grunt-checktextdomain grunt-spritesmith