すべてのsassファイルを1つのファイルにまとめる

Question

gass-sassでsassファイルを結合するオプションはありますか？

main.scss：

$var: red; 

control.scss：

@import 'main'; 
.a{ 
    color: $var; 
} 

結合された出力ファイルがあるべき単一SCSSファイル

以下のような例えば

$var: red; 
.a{ 
    color: $var; 
} 

Answer 1

あなたはこれを試しましたか？

gulp = require('gulp'); 
concat = require('gulp-concat'); 

// the default task 
gulp.task('default', function() { 
    return gulp.src('./*.scss') 
     .pipe(concat('all.scss')) 
     .pipe(gulp.dest('./dist/')); 
}); 

これは、./dist/all.scssに1つの結合scssを生成するはずです。

@import文が正しく処理されている場合、私は知りませんが、これらの の問題は、通常で処理されアドホックモジュール.css出力を生成する（例えば、gulp-sass）、...

Answer 2

ます他のすべてのscssファイルをインポートする1​​つのファイルを実行する必要がありますが、変更をリスンするときは、scssディレクトリ内のすべてのファイルの変更をリッスンする必要があります。

gulp.task('sass', function() { 
     // You have to execute one file that import all other scss files 
     return gulp.src('src/scss/*.scss') 
       .pipe(sass()) 
       .pipe(gulp.dest('build/css')); 
    }); 



gulp.task('watch', function() { 
     // You have to listen the all files in the scss directory 
     gulp.watch('src/scss/**/*.scss',['sass']);  
    });