Ошибка Gulp при создании исходной карты (CssSyntaxError)

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

events.js:85
      throw er; // Unhandled 'error' event
            ^
CssSyntaxError: /www/static/sass/maps/main.css.map:1:198: Missed semicolon

Я хочу, чтобы они были созданы в отдельном файле .map. Я не могу понять, почему он сообщает мне об ошибке в файле, который я попросил его создать...?

Что я делаю не так?

Вот мой gulpfile.js:

var gulp = require('gulp'),
    sass = require('gulp-sass'),
    minifyCSS = require('gulp-minify-css'),
    autoprefixer = require('gulp-autoprefixer'),
    sourcemaps = require('gulp-sourcemaps'),
    input = 'static/sass/**/*.scss',
    output = 'static/css';

var sassOptions = {
    errLogToConsole: true,
    outputStyle: 'expanded'
};

gulp.task('sass', function() {
    return gulp
        .src(input)
        .pipe(sourcemaps.init())
        .pipe(sass(sassOptions).on('error', sass.logError))
        .pipe(sourcemaps.write('.'))
        .pipe(autoprefixer())
        .pipe(minifyCSS())
        .pipe(gulp.dest(output))
});

gulp.task('watch', function() {
    gulp.watch(input, ['sass']);
});

// Default task - Compile then set Watch
gulp.task('default', ['sass', 'watch']);

sass gulp source-maps
person Chuck Le Butt    schedule 23.10.2015    source источник
comment
Почему вы вообще размещаете исходные карты на рабочем сервере?   -  person cimmanon    schedule 23.10.2015
comment
@cimmanon Я не размещаю свои исходные карты ни на одном рабочем сервере. Что натолкнуло вас на эту идею?   -  person Chuck Le Butt    schedule 23.10.2015
comment
Вы сделали: я хочу, чтобы они были созданы в отдельном файле .map, чтобы обычный пользователь не видел их при посещении сайта. Зачем обычному пользователю вообще видеть исходную карту, если только она не находится на рабочем сервере?   -  person cimmanon    schedule 23.10.2015
comment
@cimmanon По умолчанию исходная карта включена в CSS. Я просто хочу отделить его, чтобы мне не приходилось изменять gulpfile и перекомпилировать (для версии без исходной карты) перед каждым развертыванием.   -  person Chuck Le Butt    schedule 23.10.2015
comment
@cimmanon Я удалил для вас запутанное предложение.   -  person Chuck Le Butt    schedule 23.10.2015

Ответы (1)


arrow_upward
31
arrow_downward

Оказывается, это просто размещение строки .pipe(sourcemaps.write('.')). Перемещение решило проблему:

return gulp
    .src(input)
    .pipe(sourcemaps.init())
    .pipe(sass(sassOptions).on('error', sass.logError))
    .pipe(autoprefixer())
    .pipe(minifyCSS())
    .pipe(sourcemaps.write('.')) // This line moved to here
    .pipe(gulp.dest(output))

Хотелось бы знать, почему :-/

person Chuck Le Butt    schedule 23.10.2015
comment
то же самое здесь, но не знаю, почему исходные карты должны быть в конце - person Jorre; 08.06.2016
comment
@Jorre Я считаю, что sourcemaps.write() должен идти после autoprefixer(), потому что autoprefixer пытается добавить префиксы к исходной карте, что вызывает ошибку - person Eddie Hong; 07.10.2016
comment
@Эдди Хонг А! Спасибо, что объяснили это! Это имеет смысл. - person Chuck Le Butt; 11.10.2016
comment
Можете ли вы объяснить, почему sourcemaps.write должен быть в конце? - person gyozo kudor; 07.09.2018