gulp-cli

What is gulp-cli?

The gulp-cli package is a command-line interface for Gulp, a toolkit that helps automate time-consuming tasks in your development workflow. It allows you to run Gulp tasks from the command line, making it easier to manage and execute tasks such as minification, compilation, unit testing, linting, and more.

What are gulp-cli's main functionalities?

Task Automation

This feature allows you to define and run tasks using Gulp. The code sample demonstrates how to create a default task that simply logs a message to the console.

const gulp = require('gulp');

gulp.task('default', function() {
  // place code for your default task here
  console.log('Running default task');
});

File Watching

Gulp can watch files and directories for changes and automatically run tasks when changes are detected. The code sample shows how to watch JavaScript files in the 'src' directory and run the 'default' task whenever a file changes.

const gulp = require('gulp');

gulp.task('watch', function() {
  gulp.watch('src/*.js', gulp.series('default'));
});

File Transformation

Gulp can transform files using plugins. The code sample demonstrates how to use the 'gulp-uglify' plugin to minify JavaScript files and output them to a 'dist' directory.

const gulp = require('gulp');
const uglify = require('gulp-uglify');

gulp.task('minify', function() {
  return gulp.src('src/*.js')
    .pipe(uglify())
    .pipe(gulp.dest('dist'));
});

Other packages similar to gulp-cli

grunt

Grunt is another JavaScript task runner that automates repetitive tasks like minification, compilation, unit testing, and linting. Compared to gulp-cli, Grunt uses a configuration-over-code approach, which can be more verbose but also more explicit.

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 gulp-cli, Webpack focuses more on bundling modules and dependencies rather than task automation.

broccoli

Broccoli is a JavaScript build tool that emphasizes fast rebuilds and a simple, composable API. It is similar to gulp-cli in that it can automate tasks, but it is designed to be more efficient for large projects with many files.

README

gulp-cli

Command Line Utility for Gulp

Usage

> gulp [flags] <task> <task>...

Custom Metadata

When listing tasks with the gulp -T command, gulp-cli displays some custom metadata as defined upon task functions. Currently supported properties:

• task.description - String of the description to display.

function clean() { ... }
clean.description = 'Cleans up generated files.';

• task.flags - Object with key/value pairs being flag/description to display.

function build() { ... }
build.flags = {
  '--prod': 'Builds in production mode.'
};

Example Usage:

function build() { ... }
build.description = 'Build entire project.';
build.flags = {
  '--prod': 'Builds in production mode (minification, etc).'
};
// gulp 3.x
gulp.task('build', build);
// gulp 4.x
gulp.task(build);

Tasks

The task(s) listed on the command line will be executed. If more than one task is listed, Gulp will execute all of them concurrently, that is, as if they had all been listed as dependencies of a single task.

By default, Gulp does not serialize tasks listed on the command line. If you would like to execute tasks serially, you must specify the --series flag. e.g. gulp clean build --series

Just running gulp will execute the task default. If there is no default task, gulp will error.

Completion

Thanks to the grunt team, specifically Tyler Kellen

To enable tasks auto-completion in shell you should add eval "$(gulp --completion=shell)" in your .shellrc file.

Bash:

Add eval "$(gulp --completion=bash)" to ~/.bashrc.

Zsh:

Add eval "$(gulp --completion=zsh)" to ~/.zshrc.

Powershell:

Add Invoke-Expression ((gulp --completion=powershell) -join [System.Environment]::NewLine) to $PROFILE.

Fish:

Add gulp --completion=fish | source to ~/.config/fish/config.fish.

Compilers

You can find a list of supported languages at https://github.com/js-cli/js-interpret. If you would like to add support for a new language, send pull requests/open issues on that project.

Environment

The CLI adds process.env.INIT_CWD which is the original cwd it was launched from.

Configuration

Configuration is supported through the use of a .gulp.* file (e.g. .gulp.json, .gulp.yml). You can find a list of supported languages at https://github.com/js-cli/js-interpret.

Configuration from the home directory (~) and current working directory (cwd) are merged with cwd taking precedence.

Supported configurations properties:

Property	Description
description	Top-level description of the project/gulpfile (Replaces "Tasks for ~/path/of/gulpfile.js")
flags.continue	Continue execution of tasks upon failure by default.
flags.compactTasks	Reduce the output of task dependency tree by default.
flags.tasksDepth	Set default depth of task dependency tree.
flags.gulpfile	Set a default gulpfile
flags.silent	Silence logging by default
flags.series	Run tasks given on the CLI in series (the default is parallel)

Flags

gulp has very few flags to know about. All other flags are for tasks to use if needed.

Some flags only work with gulp 4 and will be ignored when invoked against gulp 3.

Flag	Short Flag	Description
--help	-h	Show this help.
--version	-v	Print the global and local gulp versions.
--require [path]		Will require a module before running the gulpfile. This is useful for transpilers but also has other applications.
--gulpfile [path]	-f	Manually set path of gulpfile. Useful if you have multiple gulpfiles. This will set the CWD to the gulpfile directory as well.
--cwd [path]		Manually set the CWD. The search for the gulpfile, as well as the relativity of all requires will be from here.
--verify [path (optional)]		Will verify plugins referenced in project's package.json against the plugins blacklist.
--tasks	-T	Print the task dependency tree for the loaded gulpfile.
--tasks-simple		Print a plaintext list of tasks for the loaded gulpfile.
--tasks-json [path]		Print the task dependency tree, in JSON format, for the loaded gulpfile. The [path] argument is optional, and if given writes the JSON to the path.
--tasks-depth [number]		Specify the depth of the task dependency tree to print. This flag can be used with --tasks or --tasks-json. (This flag was named --depth before but is deprecated.)
--compact-tasks		Reduce the output of task dependency tree by printing only top tasks and their child tasks. This flag can be used with --tasks or --tasks-json.
--sort-tasks		Will sort top tasks of task dependency tree. This flag can be used with --tasks.
--color		Will force gulp and gulp plugins to display colors, even when no color support is detected.
--no-color		Will force gulp and gulp plugins to not display colors, even when color support is detected.
--silent	-S	Suppress all gulp logging.
--continue		Continue execution of tasks upon failure.
--series		Run tasks given on the CLI in series (the default is parallel).
--log-level	-L	Set the loglevel. -L for least verbose and -LLLL for most verbose. -LLL is default.

License

MIT