Gulp is a JavaScript build system, Node.js-based task runner like Grunt. Gulp uses streams and code-over-configuration for a simpler and more intuitive build process.
Gulp is a javascript build system, node.js-based task runner like grunt. It can automate common tasks during your development process. Gulp uses the streams-concept and code-over-configuration for a simpler and more intuitive build process. The code-over-configuration concept can create more readable and simple tasks, despite grunt tasks which are highly over-configured.
Install
First you have to install gulp globally:
npm install gulp -g
After that you should add gulp to your project (package.json file):
npm install --save-dev gulp
Then you should create a file named gulpfile.js
and define your tasks in that. Any valid node.js code can be used in gulpfile.js
(like defining functions, importing extra modules, etc.).
After you created your tasks, you should export them (as you would in any other module). And then you can run the task by running gulp <task name>
in terminal (in the project folder). Running gulp
without specifying would run the default
task if present (the main task is usually named default
to be more convenient)
Example
const gulp = require('gulp');
const less = require('gulp-less');
const autoprefix = require('gulp-autoprefixer');
gulp.task('css', () => {
gulp.src('assets/app.less')
.pipe(less())
.pipe(autoprefix('last 2 version', 'ie 8', 'ie 9'))
.pipe(gulp.dest('build'));
});
And to run this task, run this in terminal:
$ gulp css
Useful Links
- Documentation
- GitHub
- NPM package
- Recipes
- Stream-handbook
- Plugins
- Building with Gulp (Introduction at Smashing Magazine)
- Wikipedia article
Related Tags