关于less:Less导入选项

Less 提供了CSS @import CSS规定的几个扩大，以提供更多的灵活性来解决内部文件。

语法： @import (keyword) "filename";

以下是导入指令的相干详情：

• reference，应用较少的文件但不输入。
• inline，在输入中蕴含源文件，但不对其进行解决。
• less，无论文件扩展名为什么，都将其视为less文件。
• css，无论文件扩展名为什么，都将其视为CSS文件。
• once，仅蕴含一次文件（这是默认行为）。
• multiple，屡次蕴含文件。
• optional，找不到文件时持续编译。

参考

应用 @import（reference）导入内部文件，但除非被援用，否则不将导入的款式增加到编译的输入中。

reference 依据所应用的办法（混合还是扩大），会产生不同的后果：

• mixin：当reference款式用作隐式mixin时，它的规定将被混合，标记为 “not reference”，并照常显示在被援用的地位。
• extend：扩大选择器时，仅将新选择器标记为未援用，并将其拉入援用 import 语句的地位。

Inline

应用 @import (inline) 包含内部文件，但不能对其进行解决。

Less

应用 @import (less) 医治导入的文件一样都不能少，无论文件扩展名。

@import (less) "main.css";

CSS

应用 @import (css) 医治导入的文件作为惯例CSS，无论文件扩展名，也就意味着import语句将放弃原样。

 @import (css) "main.less";
    
    // 输入
    @import "main.less";

Once

@import 语句的默认行为，也就意味着该文件仅导入一次，该文件的后续导入语句将被疏忽。

 @import (once) "main.less";
    // 此语句将被疏忽
    @import (once) "main.less";

Multiple

应用 @import (multiple) 容许应用雷同的名称导入的多个文件，这是一次相同的行为。

 // file: main.less
    div {
      color: green;
    }
    // file: index.less
    @import (multiple) "main.less";
    @import (multiple) "main.less";
    
    // 输入后果
    div {
      color: green;
    }
    div {
      color: green;
    }