2016-04-03 75 views
1

即時建立一個項目,並使用Gulp作爲任務跑步者,並使用gulp-sass作爲SASS編譯引擎。 問題是,無論我在我的main.scss文件中提交錯誤,在文件末尾的其他描述片段(代碼如下)中,一切順利,gulp handeles sass錯誤如預期的那樣,並繼續進行函數。 )由SASS錯誤導致的奇怪的吞嚥崩潰

[18:14:28] Starting 'sass'... 
[18:14:28] Finished 'sass' after 3.25 ms 
Error in plugin 'sass' 
Message: 
    src\sass\main.scss 
Error: Invalid CSS after " margin": expected "}", was ": 0;" 
     on line 37 of stdin 
>>  margin: 0; 
    ----^ 

但是,當它是第65行,整個事情只是停止工作,沒有任何日誌分號,並拒絕TU勞克除非我解決它。(例如)

[18:19:23] Starting 'sass'... 
[18:19:23] Finished 'sass' after 3.18 ms 

C:\test 

任何想法導致這個錯誤?我知道最明顯的解決方案是「noy在sass中犯錯誤」,但我仍然想解決它。

節點版本5.9.1。
OS - Windows 10.
https://bitbucket.org/gentos/strangegulpbehaviour如果需要重現錯誤,我還將一個麻煩的sass和gulpfile文件放入迷你項目中。
預先感謝您的時間和幫助!

這段代碼放在我的任何一個主要的gulp文件的末尾導致了一個描述的行爲。刪除了不合要求的其餘部分。

nav{ 
    position: fixed 
    ul{ 
     li{ 
     } 
    } 
} 

gulpfile.js

var gulp = require('gulp'), 
    sass = require('gulp-sass'), 
    watch = require('gulp-watch'), 
    cleanCSS = require('gulp-clean-css'); 
    browserSync = require("browser-sync"), 
    gutil = require('gulp-util'), 
    reload = browserSync.reload; 

var path = { 
    build: { 
     html: 'build/', 
     js: 'build/js/', 
     css: 'build/css/', 
     image: 'build/img/' 

    }, 
    src: { 
     html: 'src/*.html', 
     js: 'src/js/**/*.js', 
     sass: 'src/sass/**/*.scss', 
     css: 'src/css/**/*.css', 
     image: 'src/img/*' 
    }, 
    watch: { 
     html: 'src/**/*.html', 
     js: 'src/js/**/*.js', 
     sass: 'src/sass/*', 
     css: 'src/css/**/*.css', 
     image: 'src/img/*' 
    }, 
    clean: './build' 
}; 


function handleErrors() { 
    var gutil = require('gulp-util'); 
    var args = Array.prototype.slice.call(arguments); 

    gutil.log(gutil.colors.white.bgRed.underline.bold('Gulp error:')); 
    gutil.log(gutil.colors.red(args)); 

    this.emit('end'); 
} 
gulp.task('html',function(){ 
    gulp.src(path.src.html) 
    .pipe(gulp.dest(path.build.html)) 
    .pipe(reload({stream: true})); 
}); 

gulp.task('browser-sync', function() { 
    browserSync.init({ 
     server: { 
      baseDir: [path.build.html] 
     } 
    }); 
}); 



gulp.task('sass',function(){     
    gulp.src('./src/sass/main.scss') 
    .pipe(sass({includePaths: ['./src/sass']}).on('error', sass.logError)) 
    .pipe(sass().on('error', sass.logError)) 
    .pipe(cleanCSS({debug: true}, function(details) { 
      console.log(details.name + ': ' + details.stats.originalSize); 
      console.log(details.name + ': ' + details.stats.minifiedSize); 
     })) 
    .pipe(gulp.dest(path.build.css)) 
    .pipe(reload({stream: true})); 

}); 



gulp.task('watch', function(){ 
    watch([path.watch.sass], function(event, cb) { 
     gulp.start('sass'); 
    }); 
}); 


gulp.task('default', ["sass", "html", "browser-sync" ,"watch"]);  
+0

你已經知道的https:// WWW .npmjs.com /包/ gulp-plumber? – Hitmands

+0

我能夠運行良好的倉庫代碼: $一口青菜 [17時19分09秒]使用gulpfile〜/項目/ strangegulpbehaviour/gulpfile.js [17時19分09秒]啓動 '青菜' ... [17:19:09] 11 ms後完成'sass' main.css:1409 main.css:1056 – arnorhs

+0

我沒有在這裏看到有關Sass的[MCVE]。提供的代碼會產生[「非法嵌套」](http://stackoverflow.com/questions/22977744/what-does-this-error-in-sass-mean-illegal-nesting-only-properties-may-be -nest)錯誤,並且鏈接的repo中的代碼無錯地編譯。 – cimmanon

回答

0

運行這個命令並重置宇宙

npm install gulp-sass 

或跟蹤誤差

sass --trace --watch input.scss:output.css