Útiles plugins para gulp

Cada día amo un poco más usar gulp. Poder automatizar un gran rango de tareas a un solo comando en la consola simplifica mucho el desarrollo. Aquí dejo una lista de plugins que estoy usando en casi todo proyecto:

gulp-load-plugins

En lugar de tener que estar cargando cada plugin a mano, este se encarga de hacerlo automáticamente.

gulp-uglify

Minifica javascript para tener un código más ligero para ponerlo en producción.

gulp-sass / gulp-less

Los nombres lo dicen, ¿no? Compila Less o Sass al CSS de todos los días.

gulp-autoprefixer

Deja de escribir a mano los prefijos para estilos en distintos navegadores, tampoco uses mixins de sass o less. ¡Mejor aplica Autoprefixer a tu CSS y olvídate de problemas!

gulp-combine-media-queries

No me gusta tener muchos @media en mi archivo CSS final, una manía. El otro día encontré este plugin que nos junta los media queries que tengamos y que se repitan. Pase de 81 @media a solamente 11. Un poco menos de peso 😀

gulp-csso

Minifica CSS de una forma un poco diferente a otros plugins. Ver CSSO para mas información.

gulp-if

Simple condiciones para decidir que tareas realizar en base a variables.

gulp-sourcemaps

Nos permite generar sourcemaps en base a los archivos fuente, sin importar el procesado (compilar, autoprefixer, minificar, etc) que hagamos. Útil para debug.

gulp-concat

Para juntar varios archivos en uno mismo. ¡Menos peticiones al servidor!

gulp-watch

Se queda observando cambios a nuestros archivos para compilarlos de nuevo de forma automática.

 

Al final, un ejemplo de mi gulpfile.js podría ser algo así: