关于less的代码冗余的问题。

Question

在使用less编译的过程中，有两个less文件
common.less 里存放的是用less写的公用类，用的多的颜色啊，用的多的样式操作啊。
style.less 是页面样式文件。

现在需要在style.less里使用common.less里定义的变量或类， 于是我在style.less的开头写上了@import "common.less",

这时我查看编译后的 style.css ,发现他的开头就等于把common.less里的样式编译成css直接加进去了。

如果common.less里有很多行代码， 而且不止style.less这一个less文件要调用common.less的变量，
那么我需要在每个less文件都用@import 引入common.less, 然后最后编译出来的css等于在每个文件头部都加了一份common.less的代码，那样不就有很多重复的代码了吗？

怎么解决。

Answer 1

1. 如果是单页面，
   写一个最后编译的文件 main.less,main.less把所有页面的样式引入

   import "common.less"
   import "index.less"
   import "about.less"

2. 如果是多页面，common.less直接编译好，在每个页面头部引入，然后单独写每个页面的less即可啊

Answer 2

要用就得引啊，没办法。

Answer 3

写法：@import (reference) './*.less';
使用@import (reference)导入的外部文件，只引用里面的变量，不会编译到最终输出中。