從scss/sass流創建css文件與json對象流使用gulp節點

Question

如何從json對象的形式與一個使用這些變量的scss文件結合使用sass變量列表產生css輸出？

實際流量將是：

json/object representation of sass variables + .scss file = combined .css file

試過json-sass，但其產生不能被用來代替簡單SASS變量薩斯地圖。

終於得到了gulp-json-sass它轉換

{ 
    "someColor": "green", 
    "someObject" : { 
    "someKey" : "45px" 
    } 
} 

到

$someColor: green; 
$someObject-someKey: 45px; 

這裏實際的部分來了，如何在吞氣過程中使用，而不是一個JSON文件中的用戶修改JSON對象gulp.src(['some.json','some.scss'])？

Answer 1

這假定您已向其分配JSON字符串到一個名爲obj

function streamifyText(text) { 
    var s = new stream.Readable(); 
    s._read = function noop() {}; 
    s.push(text); 
    s.push(null); 
    return s; 
} 

可變上述功能用於將一個字符串流轉換。

gulp.task('sass', function() { 

    var combinedStream = CombinedStream.create(); 
    combinedStream.append(streamifyText(JSON.stringify(obj)).pipe(vinylSourceStream('anyName.json'))); 
    combinedStream.append(fs.createReadStream('./some.scss').pipe(vinylSourceStream('anyName.scss'))); 

    combinedStream 
     .pipe(vinylBuffer()) 
     .pipe(gulpJsonSass({sass: false})) 
     .pipe(gulpConcat('combined.scss')) 
     .pipe(gulpSass().on('error', gulpSass.logError)) 
     .pipe(gulp.dest('out/')); 
}); 

更多實施細節可以在這裏找到 -

https://gist.github.com/midhunanew/338a4bb3adce51ab29387dbe5156718a