gulp-context v0.0.20
gulp-context
Context tasks for gulp
Description
Organize the structure of gulp tasks by context. Provides sorting tasks, separation of files and folders, and fully configurable.
Dependencies
This package use gulp and require global installation.
$ npm install gulp -g
Installation
$ npm install gulp gulp-context --save-dev
Configuration
Contexts
A context is the build configuration with specific tasks. Context must have a name, tasks and can be configured to be dependent on other context.
Supported configurations:
Name | Definition |
---|---|
default: boolean | If the context is default |
clean: boolean | If the target-dir context must be cleaned before performing other tasks |
watch: boolean | Enable/Disable watch files |
from-target-context: string | Name of context dependent |
task-dir: string | Path to the folder the task files |
task: object | Tasks configuration |
Tasks
A task must be parameterized in the context and can be dependent on other tasks.
Configuration
The name of the task must match the file name.
...
"task-dir": "tasks/development"
"task": {
"copy/html"
}
In this example, the context will search for the file tasks in: tasks/development/copy/html.js
Dependencies
Dependent tasks only start after the dependent task is completed.
...
"task-dir": "tasks/production"
"task": {
"copy/html": true,
"minify/html": 'copy/html'
}
To declare a list of dependencies, use string array. example: 'copy/html', 'minify/html'
File
It must be exposed by module.exports.
The scope of the task (this) receives the parsed scope configuration.
// tasks/production/minify/html.js
var gulp = require('gulp');
, minifyHtml = require('gulp-minify-html');
module.exports = function () {
var input = this.input(this.sourceDir, ['**/*.html']);
return gulp.src(input)
.pipe(minifyHtml())
.pipe(gulp.dest(this.targetDir));
}
Scope
Each context, before performing the tasks, will parse the scope object values. When the tasks are performed, the parsed object will be used as scope (this).
A parser (defaultparser) solves the value of target-dir fields, source-dir and paths.
You can add other parsers:
var conf = require('./conf.json')
, gulpc = require('gulp-context');
function parser(scope) {
// this is the context
if(this.getName() == 'development') scope.targetDir = 'app/dist';
return scope;
}
gulpc.addParser(parser).build(conf);
Usage
Set in gulpfile.js
var conf = require('./conf.json')
, gulpc = require('gulp-context');
gulpc.build(conf);
Create a conf.json like this
{
"scope": {
"source-dir": "app/source/",
"target-dir": "app/build/",
},
"context": {
"development": {
"default": true,
"clean": true,
"watch": true,
"task-dir": "tasks/development",
"task": {
"copy/html": true
}
},
"production": {
"clean": true,
"from-target-context": "development",
"task-dir": "tasks/production",
"task": {
"minify/html": true
}
}
}
}
Create tasks files
// tasks/development/copy/html.js
module.exports = function () {
...
return gulp.src(input)
.pipe(gulp.dest(this.targetDir));
}
// tasks/production/minify/html.js
module.exports = function () {
...
return gulp.src(input)
.pipe(minifyHtml())
.pipe(gulp.dest(this.targetDir));
}
Building
Run by the terminal:
- Default context:
$ gulp
- Specific context:
$ gulp development
API
..
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago