1. gulp-task-listing
Adds the ability to provide a task listing for your gulpfile
gulp-task-listing
Package: gulp-task-listing
Created by: OverZealous
Last modified: Sat, 18 Jun 2022 18:07:16 GMT
Version: 1.1.1
Downloads: 31,959
Repository: https://github.com/OverZealous/gulp-task-listing

Install

npm install gulp-task-listing
yarn add gulp-task-listing

gulp-task-listing

NPM version Build Status

Provides an easy way to get a listing of your tasks from your gulpfile. By default, the output groups tasks based on whether or not they contain a hyphen (-), underscore (_), or colon (:) in their name.

You can optionally override the Regexp used to determine whether a task is a primary or subtask, as well as filter out tasks you don't want to see in the output.

Usage

Install using:

npm i --save-dev gulp-task-listing

Then add it to your gulpfile like so:

 var gulp = require('gulp');
var taskListing = require('gulp-task-listing');

// Add a task to render the output
gulp.task('help', taskListing);

// Add some top-level and sub tasks
gulp.task('build', ['build-js', 'build-css']);
gulp.task('build-js', function() { ... })
gulp.task('build-css', function() { ... })

gulp.task('compile', ['compile-js', 'compile-css']);
gulp.task('compile-js', function() { ... })
gulp.task('compile-css', function() { ... })

Now run gulp help, and you'll see this:

Main Tasks
------------------------------
    build
    compile
    help

Sub Tasks
------------------------------
    build-css
    build-js
    compile-css
    compile-js

Customization

You can customize the output of the task listing by using the taskListing.withFilters(subtaskFilter, excludeFilter) method. Both arguments are optional. You can pass in a string, RegExp, or a custom function.

subtaskFilter

Providing this allows you to choose which tasks are Main Tasks (by returning false), and which are Sub Tasks (by returning true).

By default, this is defined as the regular expression /[-_:]/, which means that any task with a hyphen, underscore, or colon in it's name is assumed to be a subtask.

If, for example, you wanted to only use colons to determine a task's status, you could set it up like so:

 gulp.task('help', taskListing.withFilters(/:/));

If you had something more complex, you can use a function, like so:

 gulp.task('help', taskListing.withFilters(function(task) {
	isSubTask = // test task name for sub task properties
	return isSubTask;
}));

excludeFilter

The exclude filter allows you to remove tasks from the listing. If you want to remove tasks that contain the word secret, you could set it up like so:

 gulp.task('help', taskListing.withFilters(null, 'secret'));

If you had something more complex, you can use a function, like so:

 gulp.task('help', taskListing.withFilters(null, function(task) {
	exclude = // test task name for exclusion
	return exclude;
}));

Note: setting the first argument to null allows you to retain the default behavior for subtask detection.

License

MIT License

Dependencies

RELATED POST

Enhancing Vue.js Development: Harnessing the Potential of Vue-Loader

Enhancing Vue.js Development: Harnessing the Potential of Vue-Loader

Simplify Data Validation in Vue.js: A Step-by-Step Guide to Using Regex

Simplify Data Validation in Vue.js: A Step-by-Step Guide to Using Regex

Troubleshooting Made Easy: Common Issues and Solutions with vue-loader Without vue-cli

Troubleshooting Made Easy: Common Issues and Solutions with vue-loader Without vue-cli

Optimizing Webpack 4 with Vue CLI 3: Disabling the Cache-Loader

Optimizing Webpack 4 with Vue CLI 3: Disabling the Cache-Loader

Step-by-Step Guide: How to Add a Function to Your Vuex Plugin

Step-by-Step Guide: How to Add a Function to Your Vuex Plugin