为什么要使用Sass(不是SCSS)?

时间:2011-04-21 14:15:30

标签: css 960.gs sass

每个人 - 我正在查看最近关于960网格系统的演示文稿,Refresh OKC – April 19th 2011,在倒数第二张幻灯片(101/102)上,该人建议“如果你要使用Sass,请使用Sass,不是SCSS。“鉴于SCSS是新的主要语法,为什么更喜欢Sass到SCSS?它仅仅是对CSS相似性的简洁性偏好,还是使用Sass的真正原因,而不是SCSS?

4 个答案:

答案 0 :(得分:20)

我想不出一个很好的理由:)

我查看了整套幻灯片,我认为主持人(我也认为,他也是SASS项目的连接人员?)是使用你所知道的“完成”的心态

Sass 应该更简洁,更简洁,发言人可能会从内到外知道Sass,但是根据阅读和编写CSS超过10年的个人经验,我发现 SCSS 更直观。我不必学习Sass缩进规则,SCSS和CSS中的括号提供了嵌套的视觉缩进线索 - 这与大多数其他语言的使用非常相似,因此任何来自编程/编码背景的人都会熟悉关闭巢穴?

..更重要的是,每个有效的CSS都已经是有效的SCSS,因此无需转换即可开始使用它 - 例如我能够拿走我的Drupal床单(全部29个!),改变它们的扩展并在很短的时间内重新编译/压缩它们。从那以后我一次能够拿出一小块并且“Sassify”它,使用嵌套等,我仍然希望看到括号和分号,重要的是,一旦它全部编译,你使用它!

恕我直言Sass本身对于大型项目(现有的项目,即一个未从头开始构建/认证的项目)进入的门槛太高,因为它可以通过SCSS进行模块化

所以要跟随原作者(幻灯片)的思考,而不是辩论赞成和反对,我会继续使用我认识的TYVM:)

答案 1 :(得分:11)

我认为括号.scss语法目前是默认语法,因为从LESS和vanilla CSS切换到SASS的新手更熟悉。

缩进的.sass语法是SASS中的第一个语法,与HAML相同(并与之建立终极团队)。新的括号.scss语法类似于SASS的竞争对手LESS,SASS和LESS都可以通过重命名从CSS转换。

缩进的.sass语法只有一个缺点:它不允许将函数/ mixin参数拆分为多行。这可能会使代码更难阅读(example)。

实际上,这个问题很少见,可能表明代码设计不合理,需要重构。

缩进.sass语法的唯一但决定性的优点是,它更清晰,更容易理解,同时具有同样的表现力和强大。

我创建了一个动画供您考虑差异:

enter image description here

另外,由于分号丢失(并且解释器/编译器可能产生误导性错误消息),每次代码无法工作/编译时,你是不是都讨厌它?

基本上,缩进的.sass语法只会消除视觉噪音的膨胀。

当然,需要一些时间来适应它。起初,对于拥有CSS或LESS经验的人来说,它看起来很陌生。但是一旦你习惯了一下,你会发现自己对CSS / LESS / SCSS和JavaScript的括号语法感到厌恶,并且更喜欢SASS,HAML,CoffeeScript和Python / Ruby的干净语法。

答案 2 :(得分:3)

<强>优点: 它更清洁。视觉噪音较小。更优雅。

<强>缺点: 最重要的一点:不能使用换行符。这是我对SASS唯一不喜欢的事情。见下面的例子。 其余的:对于那些与显然困难的缩进概念斗争的人来说,进入门槛更高。

在SASS,你被迫坚持使用线条。所以,如果你有

@function -create-gradient-from-color($bgcolor:#000,$depth:6%)
    ...code...

然后你不能这样做,我发现更清洁

@function -create-gradient-from-color(
    $bgcolor:     #000,
    $depth:       6%
)
    ...code...

由于换行符,这会引发错误。

但是你可以在SCSS中做到这一点,因为它不关心换行符

@function -create-gradient-from-color(
    $bgcolor:     #000,
    $depth:       6%
) {
    ...code...
}

所以我发现自己在可选的参数字符串中保留了一些内容以防止出现这种情况。

答案 3 :(得分:0)

我发现SASS输入速度要快得多。

SASS和SCSS都是CSS的一个巨大附加组件 - 如此不同以至于我不想将它们与标准CSS混淆。

学习SASS并不难 - 丢失括号,并使用制表符来决定嵌套。