gulp-sassのコンパイル後のcssをいつもの見た目にしたい

  • 8
    Like
  • 0
    Comment
More than 1 year has passed since last update.

(2015/10月時点の記事です)
ドキュメントを見ろという話ですが、書きます。
https://www.npmjs.com/package/gulp-sass

gulp-sassのコンパイル後の出力cssが
こんな感じになって気持ち悪かったです。

style.css
body {
  background: red;}

p {
  font-size: 10px;}

outputStyle(アプトプットスタイル)の変更で解決できました。
outputStyle: 'expanded'

gulpfile.js
gulp.task("sass", function() {
     gulp.src("sass/**/*scss")
    .pipe(sass({outputStyle: 'expanded'}))
    .pipe(gulp.dest("./css"));
});
style.css
body {
  background: red;
}

p {
  font-size: 10px;
}

はいすっきりです!

僕は最初に他のネットの記事の記述で適用されませんでした。
この記事も古くなるかもです。
だめな時は公式ドキュメント見てください
https://www.npmjs.com/package/gulp-sass