循環遍歷目錄或列表中的文件

Question

我正在嘗試爲單個.css文件生成多個CSS類，供頁面的body元素使用以更改頁面的整個配色方案。

我有包含變量@base00到@base0F其特定的顏色方案（https://github.com/AndrewBelt/hack.chat/tree/master/client/base16）.LESS文件的文件夾，並想導入每個文件的每個CSS類名。

這裏有一些psuedocode來實現我所需要的。

// This syntax does not exist in LESS 
for each @scheme in ./base16/ { 
    @import "@scheme" 

    body.@{scheme} { 
     background: @base00; 
     color: @base07; 
    } 

    ... 
} 

我有可能框外認爲這一個，例如建立一個生成文件通過命令行替換變量來構建和串聯通過LESS產生單一的主.css文件的每個文件的CSS。但也許有更純粹的LESS更優雅的方式。

Answer 1

不，沒有內置的文件系統功能/功能較少。 （它設計用於幾種環境，其中一些甚至不允許「目錄嗅探」）。如果有必要的話，可以編寫一個插件來提供這樣的功能，但我認爲在這種情況下，在外部執行此操作會更容易。

編譯和連接多個文件不是最簡單的方法。例如，您可以簡單地生成Less文件，該文件導入所有方案並將其應用於主模板，例如，只是一個清單：

.scheme-name { 
    @import "scheme-name"; 
    @import (multiple) "scheme-styles-template"; 
} 

陳述。其中scheme-styles-template是您除了bodyscheme.less被定義爲相同：

body& { 
    background: @base00; 
    color: @base05; 
}