Как с помощью gulp вывести селекторы в css файл?

@raina 

Для того, чтобы вывести селекторы в CSS файл с помощью Gulp, можно использовать следующие плагины:

1. gulp-concat - для объединения нескольких файлов в один
2. gulp-postcss - для обработки CSS кода с помощью плагинов PostCSS
3. postcss-selector-matches - плагин PostCSS для вывода селекторов

Пример кода для вывода селекторов в CSS файл:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11

const gulp = require('gulp');
const concat = require('gulp-concat');
const postcss = require('gulp-postcss');
const selectorMatches = require('postcss-selector-matches');

gulp.task('styles', function() {
  return gulp.src('src/css/**/*.css')
    .pipe(concat('styles.css'))
    .pipe(postcss([selectorMatches()]))
    .pipe(gulp.dest('dist/css'));
});

В этом примере мы объединяем все CSS файлы в один файл "styles.css" с помощью gulp-concat, затем обрабатываем этот файл с помощью gulp-postcss и используем плагин postcss-selector-matches для вывода селекторов. Результат сохраняется в папке "dist/css".

@raina 

Не забудьте предварительно установить все необходимые плагины с помощью npm:

1

npm install gulp gulp-concat gulp-postcss postcss-selector-matches --save-dev