watching

gulpfile.js

@@ -6,24 +6,38 @@ const debug = require('gulp-debug');
 const sourcemaps = require('gulp-sourcemaps');
 const cssnano = require('gulp-cssnano');
 const rename = require('gulp-rename');
+const gulpIf = require('gulp-if');
 const del = require('del');
 
-// Копирование добавочных CSS, который нужно иметь отдельными файлами в папке сборки
-gulp.task('copy:css', function() {
-  return gulp.src('src/css/*.css', {read: false}) // читать содержимое не нужно
-    .pipe(gulp.dest('build/css'));
-});
+// Запуск `NODE_ENV=production gulp [задача]` приведет к сборке без sourcemaps
+const isDev = !process.env.NODE_ENV || process.env.NODE_ENV == 'dev';
 
-// Компиляция и обработка LESS
+// Компиляция LESS
 gulp.task('less', function () {
+  console.log('---------- компиляция LESS');
   return gulp.src('src/less/style.less')
-    .pipe(sourcemaps.init())
+    .pipe(gulpIf(isDev, sourcemaps.init()))
     .pipe(debug({title: "LESS:"}))
     .pipe(less())
     .pipe(cssnano())
     .pipe(rename('style.min.css'))
     .pipe(debug({title: "RENAME:"}))
-    .pipe(sourcemaps.write('.'))
+    .pipe(gulpIf(isDev, sourcemaps.write('.')))
+    .pipe(gulpIf(isDev, debug({title: "SOURCEMAPS:"})))
+    .pipe(gulp.dest('build/css'));
+});
+
+// Копирование добавочных CSS, которые хочется иметь отдельными файлами
+gulp.task('copy:css', function() {
+  console.log('---------- копирование CSS');
+  return gulp.src('src/css/*.css', {since: gulp.lastRun('copy:css')})
+    .pipe(cssnano({
+      discardUnused: false // не удалять несипользованные конструкции
+    }))
+    .pipe(rename(function (path) {
+      path.extname = '.min.css'
+    }))
+    .pipe(debug({title: "RENAME:"}))
     .pipe(gulp.dest('build/css'));
 });
 
@@ -42,3 +56,12 @@ gulp.task('build', gulp.series(
   'clean:build',
   gulp.parallel('less', 'copy:css')
 ));
+
+
+
+
+// Слежение за LESS
+gulp.watch('src/less/**/*.less', gulp.series('less'));
+
+// Слежение за добавочными CSS
+gulp.watch('src/css/*.css', gulp.series('copy:css'));

package.json

@@ -12,6 +12,7 @@
     "gulp": "github:gulpjs/gulp#4.0",
     "gulp-cssnano": "^2.1.1",
     "gulp-debug": "^2.1.2",
+    "gulp-if": "^2.0.0",
     "gulp-less": "^3.0.5",
     "gulp-rename": "^1.2.2",
     "gulp-sourcemaps": "^1.6.0"

src/css/readme.md

-Это добавочные CSS-файлы, которые нужно взять в сборку отдельно и самостоятельно.
+Это добавочные CSS-файлы, которые нужно взять в сборку как отдельные файлы. 
+
+При при копировании файлы минимизируются и перед расширением файла добавляется `.min`.
+
+Вложенные папки и файлы в них — игнорируются.

src/less/style.less

+@bg_color: #fff;
 
+body {
+  background-color: @bg_color;
+}