KNACSS/gulpfile.js

// Requires
var gulp = require('gulp');

// Include plugins
var postcss = require('gulp-postcss');
var sass = require('gulp-sass');
var rename = require('gulp-rename');

var cssnano = require('cssnano'); // minifies CSS
var autoprefixer = require('autoprefixer');

var unprefix = require('postcss-unprefix'); // deletes old prefixes
var flexbugs = require('postcss-flexbugs-fixes'); // flexbox fixes for IE
var gaps = require('postcss-gap-properties'); // gaps polyfill

var plugins = [
  unprefix(),
  autoprefixer({
    grid: true
  }),
  flexbugs(),
  gaps()
];

var pluginsProd = [
  unprefix(),
  autoprefixer({
    grid: true
  }),
  flexbugs(),
  gaps(),
  cssnano()
];

// tâche cssDev = compile vers knacss-unminified.css
gulp.task('cssDev', () => {
  return gulp.src('./sass/knacss.scss')
    .pipe(sass({
      outputStyle: 'expanded' // CSS non minifiée plus lisible ('}' à la ligne)
    }))
    .pipe(postcss(plugins))
    .pipe(rename('knacss-unminified.css'))
    .pipe(gulp.dest('./css/'));
});

// tâche cssProd = compile vers knacss.css minifié
gulp.task('cssProd', () => {
  return gulp.src('./sass/knacss.scss')
    .pipe(sass())
    .pipe(postcss(pluginsProd))
    .pipe(gulp.dest('./css/'));
});

gulp.task('grillade', () => {
  return gulp.src('./sass/base/grillade-grid.scss')
    .pipe(sass())
    .pipe(postcss(pluginsProd))
    .pipe(gulp.dest('./css/'));
});

gulp.task('grillade-flex', () => {
  return gulp.src('./sass/base/grillade-flex.scss')
    .pipe(sass())
    .pipe(postcss(pluginsProd))
    .pipe(gulp.dest('./css/'));
});

// Watcher
gulp.task('watch', () => {
  gulp.watch(['./sass/*.scss'], gulp.series('cssDev'));
});

// Tâche par défaut
gulp.task('default', gulp.series('cssDev', 'cssProd', 'grillade', 'grillade-flex'));