谈Less语言的优缺点

Posted 2020-09-28

 

谈Less语言的优缺点

优点：

1. 结构清晰，便于扩展。对于模块很多的应用特别是单页 app，经常需要用 selector 来划分不同模块的 CSS 的 scope。如果满眼望去全是 .module .action .list a, .module .action .list a:hover 很难直观地理解样式应用的范围；而写成
   .module {
   　.action {
   　　a, a:hover {
   　　　//styles
   　　}
   　}
   }
   //other modules
   这样要清晰得多。这样可维护性必然会高很多，举个例子：如果要改变样式的应用范围，增加一个适用的 action，只需把 .action 改成 .action, .action2 即可，而纯 CSS 就悲剧了，要修改每个相关 rule set 的 selector。
2. 可以方便地屏蔽浏览器私有语法差异。这个不用多说，封装对浏览器语法差异的重复处理，减少无意义的机械劳动。
3. 可以轻松实现多重继承。
   .box {
   　display: block;
   }
   .thick-bordered {
   　border: 5px solid black;
   }
   .notice {
   　.box;
   　.thick-bordered;
   }
   这样无论父类有什么改动子类都会同步更新。有人说这个在 html 中把 class 写成 "notice box thick-bordered" 就好了，但是这样增加了HTML 与样式的耦合，如果模板中有多个 .notice 在修改时就难免做重复劳动，同时除了修改过的 CSS 文件外，客户端缓存的 HTML 模板也需要重新下载。在 LESS 中，如果利用 mixin 来作继承在编译后都无需生成无用的父类样式代码。
4. 完全兼容 CSS 代码，可以方便地应用到老项目中。LESS 只是在 CSS 语法上做了扩展，所以老的 CSS 代码也可以与 LESS 代码一同编译。

缺点：

         1、须要编译。无论是放在客户端还是服务器端，都是一种额外的花销。

• 作者：顾轶灵
  链接：https://www.zhihu.com/question/20259365/answer/14520148