Ошибка gulp libsass/autoprefixer для комментариев в файле sass

Question

Я переключаюсь с gulp-ruby-sass на gulp-sass. Gulp ruby ​​sass работал без ошибок, но чтобы облегчить жизнь нашим разработчикам Windows, я пытаюсь убрать зависимость от Ruby.

Я установил пакеты при настройке моего файла gulp следующим образом:

    var sassFiles = './app/assets/sass/**/*.{scss,sass}';
    var cssFiles = './app/assets/css';
    var sassOptions = {
      errLogToConsole: true,
      outputStyle: 'compact'
    };
    var autoprefixerOptions = {
      browsers: ['last 2 versions']
    };


  gulp.task('sass', function () {
     return gulp
    .src(sassFiles)
    .pipe(sourcemaps.init())
    .pipe(autoprefixer(autoprefixerOptions))
    .pipe(sass(sassOptions).on('error', sass.logError))
    .pipe(sourcemaps.write())
    .pipe(gulp.dest(cssFiles))
    .pipe(browserSync.stream());
});

За исключением того, что он терпит неудачу каждый раз по комментариям в моем файле:

[08:20:39] Starting 'sass'...

events.js:154
  throw er; // Unhandled 'error' event
  ^
 CssSyntaxError: /Users/stevelombardi/github/designsystem-  3/app/assets/sass/design_system.scss:1:1: Unknown word
 ////
 ^
/// This is a poster comment.

который сопоставляется с комментарием в файле scss. Обратите внимание, что даже если я уберу этот блок, sass просто ошибается в следующем комментарии.

Если я закомментирую канал авторефиксера, он будет работать. Так в чем здесь проблема?

Я следовал инструкциям с этого сайта.

Answer 1

Там нет ни одной строки в стиле Javascript // комментарии в CSS, только многострочные /* */ комментарии Одна линия // комментарии поддерживаются SASS/SCSS, но удаляются из полученного CSS.

поскольку autoprefixer работает только на CSS, а не на SASS / SCSS. sass() до autoprefixer():

.pipe(sass(sassOptions).on('error', sass.logError))
.pipe(autoprefixer(autoprefixerOptions))