gulp-SASS nouvelle ligne pour le sélecteur multidirectionnel

Question

Je veux construire

.btn-default { 
    color: #ccc; 

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

dans

.btn-default { 
    color: #ccc; 
} 

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

Mais au contraire, il se compare dans

.btn-default { 
    color: #ccc; 
} 

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

D'autre part, il fonctionne bien sans &, qui construisent

a, 
.btn { 
    color: #ccc; 
} 

dans

a, 
.btn { 
    color: #ccc; 
} 

Alors, comment dois-je construire & en multi-lignes?

J'utilise gulp-sass. L'option est disponible here.

Answer 1

Sass fournissent seulement 4 compilation style de sortie:
(https://github.com/sass/node-sass#outputstyle)

:nested :expanded :compact :compressed

Il n'y a pas moyen d'obtenir le résultat que vous voulez, mais vous pouvez utiliser quelque chose comme: https://github.com/csscomb/csscomb.js pour le formater.