这是个在博客开发过程中发生的小事~

css vs css-module vs cssnext vs sass vs less

因为之前都是纯 css 来进行开发的，所以一开始我还觉得这东西挺单纯的，无非就是各种属性层级的组合然后链接到 html 就完事了——
直到我开始考虑要在博客中使用那种方式来支持 css 为止……

作为全球最知名的 css 扩展之一，sass 提供了很多 css 没有的额外功能，比如变量、嵌套规则之类的。sass 其实在我一开始入门前端的时候就有所了解，但是因为他需要依赖 Ruby，所以在一股莫名不想安装 Ruby 的心情下就一直没有用过。

不想安装 Ruby 的心情促使我去寻找 sass 的替代品，于是 less 就进入了我的视野，从功能上来说，他和 sass 提供的功能类似，但 less 是依赖 JavaScript 的，工具集对于前端来说比较统一。

css-module 则是在接触 react 的时候了解到的，他和 sass、less 不一样，他的目标是控制作用域。众所周知，CSS 的规则都是全局的，任何一个组件的样式规则，都对整个页面有效，这样在开发的时候非常容易出现样式冲突，而 css-module 的局部作用域正好解决了这个问题。

只有 cssnext 这东西是这次正真学到的新内容，这个东西就像 Babel 一样，为 css 提供还未支持的新语法（css4），简单试了下，居然还挺好用的，单从语法上来说，css4 提供变量、嵌套规则等等新功能，有种趋近 sass 与 less 的感觉，不过缺点也很明显，大多都还是未处于实现的功能，具体会怎样还有待观望，尝尝鲜玩玩倒是不错。
ps.看了看文档，cssnext 的作者似乎已经停止维护这个插件，推荐用 postcss-preset-env 替代了。

这么多选择对于我这种选择困难症真的是很难受，最终是在博客中集成了 less + css-module，毕竟 cssnext 虽然强大，但是从功能上来说还是比 sass、less 之类的扩展略逊一筹。