以遞歸方式在陣列上運行Grunt任務

我必須爲不同的位置和瀏覽器構建一些css文件，這些文件都是通過文件名中的一個標記來描述的。例如：以遞歸方式在陣列上運行Grunt任務

風格，en.css
風格，jp.css
風格，ie.css

差異是由LESS布爾變量處理的內容@isIE，@isEN ，@isJA，@isDE等與文件命名模式匹配。

我很想自動通過傳遞咕嚕標誌的數組，然後對每個建設這些不同的版本：

設置變量爲一個文件夾中的所有文件LESS
少跑編譯器（同爲所有語言）
使用變量在導出的文件名

This answer spells out the iterations但有一個整潔的方法？

2015-04-21 Lance

基於How to configure sourceMaps for LESS using Grunt when there is more than one file in your project?和Compile LESS to multiple CSS files, based on variable value您可以創建Gruntfile.js如下：

module.exports = function (grunt) { 
    'use strict'; 

var TaskArray = []; 
var tasks = []; 
//var lessVariable = ''; 
var languages = ['de','en','nl']; 

languages.forEach(function(language) { 
     tasks[language] = {options: {sourceMap:true, modifyVars:{}},files:{} }; 
     tasks[language]['options']['sourceMapFilename'] = 'dist/' + language + '.map.css'; 
     tasks[language]['options']['modifyVars']['is' + language.toUpperCase()]= true; 
     tasks[language]['files']['dist/' + language + '.css'] = 'less/project.less'; 
     TaskArray.push('less:' + language); 
}); 
grunt.loadNpmTasks('grunt-contrib-less'); 
grunt.config('less',tasks); 
grunt.registerTask('default', TaskArray); 
};

上述動態使用languages陣列創建任務。您的布爾變量由grunt-contrib-less的modifyVars選項更改，另請參閱http://lesscss.org/usage/#using-less-in-the-browser-modify-variables。

當你less/project.less包含下面的代碼：

@isDE: false; 
@isNL: false; 
@isEN: false; 

.m when (@isDE) { 
language: de; 
} 

.m when (@isNL) { 
language: nl; 
} 

.m when (@isEN) { 
language: en; 
} 

.m();

運行grunt && cat dist/nl.css應該像下面的輸出顯示：

Running "less:de" (less) task 
File dist/de.map.css created. 
File dist/de.css created 

Running "less:en" (less) task 
File dist/en.map.css created. 
File dist/en.css created 

Running "less:nl" (less) task 
File dist/nl.map.css created. 
File dist/nl.css created 

Done, without errors. 
.m { 
    language: nl; 
} 
/*# sourceMappingURL=dist/nl.map.css */

來源

2015-04-24 20:35:06

以遞歸方式在陣列上運行Grunt任務

回答

相關問題