grunt-cli

What is grunt-cli?

The grunt-cli package is the command line interface for Grunt, a JavaScript task runner. It allows you to automate repetitive tasks such as minification, compilation, unit testing, linting, and more.

What are grunt-cli's main functionalities?

Task Automation

This code sample demonstrates how to automate the task of JavaScript file minification using the 'uglify' plugin. The 'uglify' task reads a source file and outputs a minified version.

module.exports = function(grunt) {
  grunt.initConfig({
    pkg: grunt.file.readJSON('package.json'),
    uglify: {
      options: {
        banner: '/*! <%= pkg.name %> <%= grunt.template.today("yyyy-mm-dd") %> */\n'
      },
      build: {
        src: 'src/<%= pkg.name %>.js',
        dest: 'build/<%= pkg.name %>.min.js'
      }
    }
  });
  grunt.loadNpmTasks('grunt-contrib-uglify');
  grunt.registerTask('default', ['uglify']);
};

File Watching

This code sample shows how to set up a file watcher that monitors JavaScript files for changes and runs the 'jshint' task whenever a change is detected.

module.exports = function(grunt) {
  grunt.initConfig({
    watch: {
      scripts: {
        files: ['**/*.js'],
        tasks: ['jshint'],
        options: {
          spawn: false,
        },
      },
    },
  });
  grunt.loadNpmTasks('grunt-contrib-watch');
  grunt.registerTask('default', ['watch']);
};

Compilation

This code sample demonstrates how to compile Sass files into CSS using the 'sass' plugin. The 'sass' task reads a Sass file and outputs a compiled CSS file.

module.exports = function(grunt) {
  grunt.initConfig({
    sass: {
      dist: {
        files: {
          'main.css': 'main.scss'
        }
      }
    }
  });
  grunt.loadNpmTasks('grunt-contrib-sass');
  grunt.registerTask('default', ['sass']);
};

Other packages similar to grunt-cli

gulp

Gulp is another JavaScript task runner that uses a code-over-configuration approach. It is known for its speed and flexibility, allowing you to use Node.js streams to build automation tasks. Compared to Grunt, Gulp's syntax is more concise and it often performs better due to its use of streams.

webpack

Webpack is a module bundler primarily for JavaScript, but it can transform front-end assets like HTML, CSS, and images if the corresponding loaders are included. Unlike Grunt, which is a task runner, Webpack focuses on bundling modules and dependencies, making it more suitable for complex front-end applications.

broccoli

Broccoli is a JavaScript build tool that emphasizes a simple, composable, and fast build pipeline. It is particularly well-suited for large projects and offers a more modern approach compared to Grunt. Broccoli uses a tree-based architecture, which can make it easier to manage complex build processes.

README

grunt-cli

Grunt's command line interface.

Install this globally and you'll have access to the grunt command anywhere on your system.

npm install -g grunt-cli

See Getting Started With Grunt for more information.