欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  web前端

写 SCSS 代码应该遵循的原则_html/css_WEB-ITnose

程序员文章站 2022-03-18 19:05:38
...

KISS – Keep It Simple Stupid

“Always code as if the guy who ends up maintaining your code will be a violent psychopath who knows where you live.”– Martin Golding

keep sass simple,不要写过度抽象,不要用复杂的语法实现简单的功能。实际上 css 文件不需要很复杂。有了预编译以后,稍不注意就产生过多的层级、巨复杂的选择器了。还有滥用函数,一点点重复都抽象出来。

正确的做法是有逻辑关联的样式才合并到一起。语义上有继承关系的样式,才使用继承。相关的代码不要分散到几百行之外。

DRY – Don’t Repeat Yourself

scss 的变量,extend,mixin 就是为了做这个的。mixin 会生成重复的代码,但是符合 Single source of truth 原则。DRY 不是不让重复(don’t repeat)而是为了保证源头只有一个,源代码只出现在一处,一次修改自动同步到所有的CSS文件。CSS中,机器自动复制出来的的重复,不破坏 DRY 原则。

参考资料:

Single source of truth https://en.wikipedia.org/wiki/Single_source_of_truth

DRY Don’t repeat yourself https://en.wikipedia.org/wiki/Don%27t_repeat_yourself

KISS https://en.wikipedia.org/wiki/KISS_principle

Always code as if the guy who ends up maintaining your code will be a violent psychopath who knows where you live

学这些名词有什么用?这些简洁的词,有公认的含义。跟别人交流的时候,提到这个词就明白对方在说什么。就像是成语一样,方便交流。