Gulp será el gestor de tareas que nos ayudará a orquestar todo lo que hagamos con PostCSS.
La primera, será una tarea que sirve como servidor de desarrollo:
gulp.task(‘serve’,function () {
browserSync-init({
server: {
baseDir: ‘./dist’
}
})
})
La segunda, será la tarea para procesar el CSS:
gulp.task(‘css’,function () {
var processors = []
return gulp.src(‘./src/*.css’)
.pipe(postcss(processor))
.pipe(postcss(processor))/css’’))
.pipe(browserSync.stream())
})
La última, será la tarea para observar los cambios:
gulp.task(‘watch’,function () {
gulp.watch(‘./src/*css’, [‘css])
gulp.watch(‘./dist/*.html’).on(‘change’, browserSync.reload)
})
Por último, para unificar las 3 tareas usamos:
gulp.task(‘default’, [‘watch’, ‘serve’])
