Question

您好有办法更改gulp-sass设置，以便结束括号位于其自己的行上吗？

当前CSS输出：

body {
  width: 100%; }

我想要的是什么：

body {
  width: 100%;
}

谢谢！

Answer 1

您只需要这段代码：

gulp.task('sass', function(){
  return gulp.src('app/scss/styles.scss')
    .pipe(sass({outputStyle: 'expanded'})) // Converts Sass to CSS with gulp-sass
    .pipe(gulp.dest('app/css'))
});

您需要澄清您想要扩展的输出方式您可以在此处找到有关different sass output styles

的信息

Answer 2

您可以在sass编译器之后使用gulp-cssbeautify。

gulp.task('sass', function() {
    return gulp.src('./scss/*.css')
       .pipe(sass().on('error', sass.logError))
       .pipe(cssbeautify())
       .pipe(gulp.dest('./css/'));
}

编辑：在我看来乔治H.他的答案更有效率，请看下面。

结构和造型Gulp Sass输出

2 个答案: