如何在两个 @imported sass 文件之间添加换行符？答案

【问题标题】：How to add newlines between tow @imported sass files?如何在两个 @imported sass 文件之间添加换行符？
【发布时间】：2017-02-23 08:33:04
【问题描述】：

我的 main.scss 文件如下：

@import "components/variables.scss"; // This file contains all font variables etc  

@import "components/global.scss"; // This file contains global styles to be applied 

@import "components/header.scss"; // All header and top menu navigation

@import "components/bslider.scss"; // The main middle slider that have whole content of webside as slides.

我在每个 @import 语句之后添加了换行符，但是当生成输出时，各个文件的 css 之间没有空格。输出是这样的：

* {
    font-size: 14px;
}
/*global css finishes*/
/*header css starts*/
header {
    position: absolute;
}

但我想要这样的换行符：

* {
    font-size: 14px;
}
/*global css finishes*/


/*header css starts*/
header {
    position: absolute;
}

我正在使用 yeoman webapp 生成器将 sass 转换为 css。任何帮助将不胜感激，谢谢。

【问题讨论】：

标签： css sass yeoman

【解决方案1】：

我没用过yeoman，但是你可以改变输出的css的样式

sass --watch yourfile.scss:style.css --style expanded

您可以在此处阅读有关 SASS 样式的更多信息：

http://sass-lang.com/documentation/file.SASS_REFERENCE.html#output_style

【讨论】：

我已经得到了扩展的 sass 输出。但这不会保留 sass 中的换行符。