sassCore——一个值得你拥有的sass库

sassCore在sass库中作为一个后来者,不可避免的要拿来和最具代表的compass做比较。当然这一方面是目前比较全面的sass库也比较少,而另一方面也说明sassCore其实也是有一定含金量的,不然烂的可以的话,也就不用去比较了。如果你还不了解sass,你可以先阅读下入门的sassGuide,然后可以进一步看下前三篇进阶教程sass揭秘系列

在这我们先介绍下sassCore产生的背景。

sassCore是怎么产生的?

设计这个sassCore绝不是闲得蛋疼去重复造轮子,也不是一时手痒来挑战下自己的技术,它的出现完全在我的计划范围之外。

原先的计划是做一个样式库,然后加上js交互就组成一个框架。因为那个时候接触sass也一段时间了,了解了它能创造的一些价值,所以果断使用sass,而不是纯css来构造。原本是打算用compass这个作为基础的,于是花了一段时间去研究。然后发现它的一些弊端:

  • 文件关系比较复杂,有点晕乎,这太要命了。
  • 到处都是@mixin,太多了有点过,开发的时候几乎记不住这么多@mixin。
  • reset样式有点过时。
  • 最关键的一点是居然没有%这个占位选择器,也就意味着样式都是拷贝存在的,这太不科学了。

当然在研究compass的时候也看了很多其他的一些sass方面的资料。在此也感谢大漠,这期间有什么国外sass方面的文章都给我传送下,从中吸取了不少养料。通过众多的翻阅,下面这些资源给了我很大的帮助及灵感,并让我迅速成长,甚至sassCore里面的某些文件就是它们的影子。

如果你仔细研究下,这些文件一定程度可以媲美compass,甚至超越了compass的相应功能,但是它们有个缺点,就是只负责一方面,功能单一,当然下面的那个bootstrap就不是单功能方面的了。

正是有了这么多优秀的scss单功能文件,让我有了放弃compass的理由。一开始我也是零碎的调用,想用什么然后就调用上面的那些单文件,后来写了点demo之后,发现这样太蛋疼了,干脆有了想法依托于这些优秀的单文件自己搞个库,跟compass一样。然后就规划这个库要实现什么功能,如何组织起来。于是又重新研究bootstrap-sass和compass,边写边调整,慢慢的才有了现在的sassCore。

sassCore与compass比较

先说下sassCore对于compass的不足吧。目前compass的三点,sassCore还没有实现:

  1. compass提供安装版,sassCore暂时不支持。
  2. compass的css3渐变背景,对于ie9可以设置用svg来兼容,而sassCore没做到。来个实例吧,最后一个支持svg:bacground gradients demo
  3. compass还有一个强大的自动合并雪碧图功能,确实很棒,sassCore也没有。你也可以尝试下spriting with compass

其余的都是一些零碎的东西,可能compass有sassCore没有,也可能sassCore有compass没有,实现起来技术难度也没什么问题,没什么好说的。

当然有不足也有些长处,全是缺点的话,还搞个毛线,自己拍死得了,简单说下sassCore的一些优势:

  1. 总得来说,sassCore涵盖的范围比compass更广,能做更多基础的东西。
  2. 文件结构比较清晰,所以使用起来比compass要顺手点,而且扩展起来也比较方便。
  3. 有了%占位选择器,可以组合申明样式,这个东西是个乖乖仔,做到只调用的时候才解析出样式,不调用不产生任何样式。也许compass的下一步也会有这个东西。
  4. 吸收前面几个优秀的单功能文件,进一步扩展优化,在这些功能方面超越了compass对应的功能。
  5. 两种调用方式,一种产生基础样式调用_base.scss,一种只包括功能不产生任何多余样式调用_function.scss。除此之外,基础样式里面还可以根据自己的需求,进一步减少多余样式。

大概就是这么多,优缺点可能都有点漏,也欢迎指正。大家可以根据自己的喜好或需求来选择使用哪个库比较好。然后sassCore库的api正在开发中,欢迎感兴趣的同学参加支持sass的推广,在此先表示感谢!

原文链接:http://www.w3cplus.com/preprocessor/sasscore-vs-compass.html

发表评论

登录后才能评论