2

gulp-sass を使用していますが、次のエラーが表示されます。

ESL@eslmbp /Applications/MAMP/htdocs/craigpomranz[master*]$ gulp sass
[17:54:53] Using gulpfile /Applications/MAMP/htdocs/craigpomranz/gulpfile.js
[17:54:53] Starting 'sass'...

stream.js:94
      throw er; // Unhandled stream error in pipe.
            ^
Error in plugin 'gulp-sass'
/Applications/MAMP/htdocs/craigpomranz/wp-content/themes/craig/scss/partials/base:13: error: error reading values after 'xsmall'

    at opts.error (/Applications/MAMP/htdocs/craigpomranz/node_modules/gulp-sass/index.js:67:17)
    at onError (/Applications/MAMP/htdocs/craigpomranz/node_modules/gulp-sass/node_modules/node-sass/sass.js:73:16)

ここに私のgulpfile.jsがあります：

// Include gulp
var gulp = require('gulp'); 

// Include Our Plugins
var jshint = require('gulp-jshint');
var sass = require('gulp-sass');
//var sass = require('gulp-ruby-sass');
var concat = require('gulp-concat');
var uglify = require('gulp-uglify');
var rename = require('gulp-rename');
var minify = require('gulp-minify-css');
var browserSync = require('browser-sync');
var rename = require('gulp-rename');

var theme_path = 'wp-content/themes/craig/';

// Compile Our Sass
gulp.task('sass', function() {
    return gulp.src(theme_path+'scss/main.scss')
        .pipe(sass())
        // .pipe(minify({keepBreaks:true}))
        .pipe(minify())
        //.pipe(rename('style.css'))
        .pipe(gulp.dest(theme_path));
});

同じ scss (ファイル) は、次のように正常にコンパイルされます。sass --watch path/to/main.scss --compressed

別のプラグイン (gulp-ruby-sass) を試してみたところ、別のエラーがスローされました。

私は何を間違っていますか？

更新エラー メッセージは、_base.scss の 13 行目に言及しています。そのファイルの内容は次のとおりです。

//Setting breakpoints
$xsmall : 400px; 
$small : 768px; //phones
$medium : 1024px; //tablets
$breakpoints: ( 
    'xsmall' :'(max-width: #{$xsmall})',  //<--HERE IS LINE 13
    'small': '(max-width: #{$small})',
    // 'small': '(min-width: #{$xsmall+1}) and (max-width: #{$small})',
    'medium': '(min-width: #{$small+1}) and (max-width: #{$medium})',
    'large': '(min-width: #{$medium + 1})' 
);
4

1 に答える 1