Как использовать gulp-stylelint совместно с gulp-sass?

Question

[ilya2306]

Собираю стили с помощью gulp-sass. Линтую с помощью gulp-stylelint.

Имеется несколько входных файлов, каждый из которых собирается в отдельности. В каждом файле есть import.
Подскажите как линтовать стили до их компиляции, но включая линтинг файлов через import.

Функция для компиляции стилей

const gulp = require('gulp');
const sass = require('gulp-sass');
const plumber = require('gulp-plumber');
const gulpStylelint = require('gulp-stylelint');

function compileStyles(src, dest) {
  return gulp.src(src)
    .pipe(plumber({
      errorHandler: console.error
    }))
    .pipe(sass().on('error', sass.logError))
    .pipe(gulp.dest(dest));
}

Функция для линтинга:

function lintStyles(src) {
  return gulp.src(src)
    .pipe(gulpStylelint({
      failAfterError: true,
      reporters: [
        {formatter: 'string', console: true}
      ]
    }));
}

Есть вариант запустить линтинг стилей до компиляции, но тогда будут проверяться все файлы, а хотелось бы чтобы проверялись только те файлы, которые используются во входном файле.

Comments

[Сергей delphinpro]

Воткнуть пайп с линтером в задачу compileStyles перед sass не вариант?

[ilya2306]

Сергей delphinpro, Вариант, но либо я делаю что-то не так, либо линтер не понимает импорты, вернее их содержимое

[Сергей delphinpro]

ilya2306, а, я понял суть проблемы .
Наверное никак не сделать, кроме линтовки всех файлов.

Не по теме, но я бы вешал линтер на прекоммит. Ни к чему делать проверки на каждое сохранение, только отвлекать от работы будет.

[ilya2306]

Сергей delphinpro, насчет проверки на кадое сохранение - есть способы, чтобы применять задачи только к изменившимся файлам, это не проблема.
Насчет прекоммита соглашусь, но для этого надо коммитить (а кто-то ведь еще использует SVN).

На мой взгляд здесь два решения:
- либо форкать sass, и там расширять api
- либо не заморачиваться и просто запускать линт до компиляции (отдельной задачей)

Answer 1

[amf1k]

Наверно проще будет не засовывать линтер в gulp, а просто сделать скрипт в packege.json

"scripts": {
    "style:lint": "stylelint 'src/style/**/*.scss' --syntax scss",
    "style:fix": "stylelint 'src/style/**/*.scss' --syntax scss --fix",
}