gulp-sass多选择器的新行

Question

我想建立

.btn-default {
    color: #ccc;

    &:hover,
    &:focus {
        color: #ddd;
    }
}

到

.btn-default {
    color: #ccc;
}

.btn-default:hover, 
.btn-default:focus {
    color: #ddd;
}

但相反，它会与

进行比较

.btn-default {
    color: #ccc;
}

.btn-default:hover, .btn-default:focus {
    color: #ddd;
}

另一方面，没有&构建

，它可以正常工作

a,
.btn {
    color: #ccc;
}

进入

a,
.btn {
    color: #ccc;
}

那么，我应该如何将&构建成多行？

我使用gulp-sass。选项可用here。

Answer 1

Sass只提供4种编译输出方式：
（https://github.com/sass/node-sass#outputstyle）

:nested :expanded :compact :compressed

无法获得您想要的结果，但您可以使用类似https://github.com/csscomb/csscomb.js的内容来格式化它。