GithubHelp home page GithubHelp logo

gulp-add-tasks's Introduction

gulp-add-tasks

npm Travis

A utility to dynamically add tasks based on a specified task structure to a passed-in instance of gulp.

Integrates with gulp-help and run-sequence to provide a more robust user experience, as well as the ability to run tasks synchronously

Install

npm i gulp-add-tasks --save-dev

Usage

const gulp = require('gulp');
const addTasks = require('gulp-add-tasks')(gulp);

addTasks(...taskLists)

Task list structure

Task list accepts two object structures, one for "multi-tasks" and one for simple task and function pairs, both of which assume each key in the map as the gulp task name.

multi-task structure

Name Description
tasks An array of tasks, passed directly to run-sequence
description A task description, used by gulp-help
options Programmatic options to be utlized by the tasks, used by gulp-help
aliases An array of aliases that the task can be called with, used by gulp-help
Example
const gulp = require('gulp');
const addTasks = require('gulp-add-tasks')(gulp);

addTasks({
  build: {
    description: 'Build application for distribution',
    tasks: [
      ['sass', 'babel']
    ],
    options: {
      production: 'Minify assets with this flag'
    }
  }
});

gulp build will now be a runnable task via the CLI, which will, in turn, call gulp sass & gulp babel (async) via run-sequence.

single task structure

A simple key/value pair, with the key representing the task name, and the value a reference to a function, can be used to create a simple task. This is particularly useful when used in conjunction with require-tasks, which generates a structure that can be directly passed to gulp-add-tasks.

Example
const gulp = require('gulp');
const addTasks = require('gulp-add-tasks')(gulp);

addTasks({
  babel() {
    const babel = require('gulp-babel');

    return gulp.src('src/**/*.js')
      .pipe(babel({
        presets: ['es2015']
      }))
      .pipe(gulp.dest('dist'));
  }
});

gulp babel will now be a runnable task via the CLI.

Advanced Usage

gulp-add-tasks supports multi-tasks, separating a nested structure via colons (:), e.g.

const gulp = require('gulp');
const addTasks = require('gulp-add-tasks')(gulp);

addTasks({
  copy: {
    css() {
      return gulp.src('src/**/*.css')
        .pipe(gulp.dest('dist/css'));
    },
    js() {
      return gulp.src('src/**/*.js')
        .pipe(gulp.dest('dist/js'));
    }
  }
})

gulp will now have the tasks copy:css and copy:js available for usage from the command line.

gulp-add-tasks's People

Contributors

dschau avatar

Watchers

 avatar  avatar  avatar

Forkers

bluelovers

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.