Essential Gulp Plugins Save

Living list of most useful plugins for Gulp

Project README

##HTML&CSS autoprefixer - parse CSS and add vendor prefixes to rules by Can I Use.

gulp-browser-sync - keep multiple browsers & devices in sync when building websites.

gulp-useref - parse build blocks in HTML files to replace references to non-optimized scripts or stylesheets.

gulp-email-design - a workflow for designing and testing HTML email templates.

gulp-uncss - remove unused CSS from your projects.

gulp-csso - very cool CSS minificator. In addition, there are many CSS optimizers and benchmark tests (GitHub) for them. But recently I saw most powerful Shorthand utility and gulp-shorthand, which does folowing:

a {
	font-family: Arial;
	font-style: italic;
	font-size: 14px;
	line-height: 18px;
	font-weight: bold;
	background-image: url('example.png');
	background-color: red;
	background-size: cover;
	background-repeat: no-repeat;


a {
  font: italic bold 14px/18px Arial;
  background: red url('example.png') no-repeat / cover;

gulp-htmlmin - neat HTML minificator.

gulp-csscomb - refines the structure of your CSS.

gulp-csslint - CSS linter.

gulp-htmlhint - HTML validator using htmlhint

gulp-htmllint - HTML validator using htmllint

gulp-processhtml - Process html files at build time to modify them as you wish.

gulp-myth - Postprocessor that polyfills CSS

##JavaScript gulp-autopolyfiller - precise polyfills. This is like Autoprefixer, but for JavaScript polyfills.

gulp-babel - transpiler for writing next generation JavaScript.

gulp-jsfmt - for formatting, searching, and rewriting JavaScript.

gulp-jscs - Check JavaScript code style with jscs.

gulp-modernizr - build out a lean, mean Modernizr machine.

gulp-express — start (and supervise) an Express.js web server using, works well with

gulp-requirejs and gulp-browserify - optimize the work with RequireJS and Browserify respectively.

gulp-plato - generate static analysis reports.

gulp-complexity - evaluates code maintainability using Halstead and Cyclomatic metrics.

fixmyjs - automatically fix silly lint errors with help of JSHint (gulp-jshint).

gulp-jscpd — copy/paste detector for programming source code.

gulp-buddy.js - magic number detection for javascript.

gulp-jsonlint - JSON validator.

gulp-uglify - JavaScript compressor.

gulp-concat - concatenate files.

gulp-standard - Check JavaScript code style with Standard.

###Unit Tests

##Graphics gulpicon - mystical CSS icon solution.

gulp-iconfont - SVG to webfont converter.

gulp-responsive - produce images at different sizes for responsive websites.

gulp-sharp - fastest module for work JPEG, PNG, WebP and TIFF images.

gulp-svgstore - merge SVGs from a folder.

gulp-imacss - application and library that transforms image files to data URIs.

gulp-imagemin и gulp-tinypng or fimage compression.

gulp-spritesmith - converting a set of images into a spritesheet and corresponding CSS variables.


gulp-grunt - able to run Grunt tasks from Gulp.

gulp-watch — run tasks whenever watched files change.

gulp-notify - automatic error messages in system notifications center when Gulp tasks fail.

gulp-git - able to use Git commands.

gulp-jsdoc - generate JavaScript documentation by running JSDoc3.

gulp-rev - static file asset revisioning through content hashing.

gulp-bump - increments versions in package JSON and gulp-update, which automatically updates packages.

main-bower-files - inject Bower packages.

gulp-removelogs - remove console logging statements.

gulp-preprocess - preprocess files based off environment configuration.

gulp-duration — displays the elapsed execution time of Gulp tasks.

gulp-changed and gulp-newer — run Gulp tasks with only those source files modified since the last successful run.

gulp-connect - simple static web server.

gulp-shell - run Shell commands.

gulp-ssh - provides the ability to connect via SSH and SFTP.

gulp-zip - compress files and folders..

gulp-clean and gulp-copy - respectively remove and copy sources.

gulp-replace - Search and replace strings in text files.

gulp-filesize - displays sizes of files in a readable format.

gulp-util - utilities for developing Gulp plugins.

gulp-plumber - prevents pipe breaking caused by errors from gulp plugins

gulp-data - Generate a data object from a variety of sources: json, front-matter, database, anything. Compatible with many plugins including gulp-jade and gulp-swig

gulp-props - Convert Java .properties files to JSON

gulp-todo - Generate a from todos & fixmes in your code

gulp-markdown - Markdown to HTML with marked

gulp-gh-pages - Publish contents to Github pages

gulp-load-plugins - Automatically load any gulp plugins in your package.json

gulp-sourcemaps - Source map support



  • psi - PageSpeed Insights with reporting.
  • tmi - TMI (Too Many Images) - discover your image weight on the web.
  • ngrok - Introspected tunnels to localhost.
  • pageres - responsive website screenshots.
  • matchdep - filter npm module dependencies.
  • Maybe some automatization methods you want to use directly in the editor, so look at the The Best Plugins for Sublime Text.
Open Source Agenda is not affiliated with "Essential Gulp Plugins" Project. README Source: Pestov/essential-gulp-plugins
Open Issues
Last Commit
6 years ago

Open Source Agenda Badge

Open Source Agenda Rating