Неправильная исходная карта после объединения CSS поставщика с LESS и после gulp-minify

Я пытаюсь сделать следующее:

  1. Объедините все файлы CSS (плагины jQuery)
  2. Комбинируйте медиа-запросы
  3. Минимизировать CSS
  4. Написать исходную карту

после этого я пытаюсь сделать что-то еще в другой папке

  1. Перевести МЕНЬШЕ
  2. Комбинируйте медиа-запросы
  3. Минимизировать полученный CSS
  4. Написать исходную карту
  5. Автопрефиксы

Это выглядит так:

gulp.task('styles', function() {
  var streamCSS = gulp.src(sources.css)
    .pipe(sourcemaps.init())
    .pipe(concat('vendor.css'))
    .pipe(cmq())
    .pipe(minify({ keepSpecialComments: '*' }))
    .pipe(sourcemaps.write());

  var streamLESS = gulp.src(sources.less)
    .pipe(plumber({ errorHandler: errorHandler }))
    .pipe(sourcemaps.init())
    .pipe(less())
    .on('error', swallowError)
    .pipe(cmq())
    .pipe(minify({ keepSpecialComments: '*' }))
    .pipe(sourcemaps.write())
    .pipe(prefix("last 2 versions", "> 1%", "ios >= 6", { map: true }))
    .on('error', swallowError);

  return es.merge(streamCSS, streamLESS)
    .pipe(plumber({ errorHandler: errorHandler }))
    .pipe(concat('main.css'))
    .pipe(gulp.dest(destinations.css))
    .pipe(connect.reload());
});

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

Для этого я использую следующие библиотеки:

  • gulp-concat
  • без глотка
  • gulp-автопрефиксер
  • gulp-объединение медиа-запросов
  • gulp-sourcemaps
  • gulp-minify-css

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

Спасибо за каждый совет!


gulp gulp-less gulp-sourcemaps
person lumio    schedule 14.08.2014    source источник

Ответы (1)


arrow_upward
1
arrow_downward

Можете ли вы попытаться объединить потоки перед вызовом функции инициализации исходной карты?

У меня не было возможности протестировать следующий код (многие требования опущены), но у вас может быть идея:

var filter = require('gulp-filter');

var lessFilter = filter('**/*.less');

gulp.task('styles', function() {
    return gulp.src([sources.css, sources.less])
        .pipe(sourcemaps.init())
        .pipe(lessFilter)
        .pipe(less())
        .pipe(filter.restore())
        .pipe(minify({ keepSpecialComments: '*' }))
        .pipe(concat('main.css'))
        .pipe(sourcemaps.write())
        .pipe(gulp.dest(destinations.css))
});
person Ghidello    schedule 28.10.2014