2014-01-24 5 views
1

В настоящее время новый для Grunt и рассматривает задачу создания спрайтов CSS из коллекции исходных файлов (в общей структуре папок).Looping through Grunt tasks

Для этого я использовал grunt-spritesmith: https://npmjs.org/package/grunt-spritesmith.

На данный момент у меня есть задача наблюдать за конкретной папкой и создавать спрайты и частичные части SCSS.

Мой вопрос: Можно ли перебирать массив имен сайтов и передавать их в задачи ниже - без дублирования задачи для каждого сайта?

grunt.initConfig({ 

    pkg: grunt.file.readJSON('package.json'), 

    sprite: { 

     normal: { 
      src: 'site1/images/sprite/1x/*.png', 
      destImg: 'site1/images/site1-sprite.png', 
      destCSS: 'styles/scss/site1/sprite/_spritesmith.scss', 
      algorithm: 'binary-tree', 
      padding: 20, 
      cssFormat: 'scss', 
      engine: 'pngsmith', 
      cssOpts: { 
       cssClass: function(item) { 
        return '.' + item.name; 
       }, 
      }, 
     }, 

     retina: { 
      src: 'site1/images/sprite/2x/*.png', 
      destImg: 'site1/images/site1-sprite-2x.png', 
      destCSS: 'styles/scss/site1/sprite/_spritesmith-retina.scss', 
      algorithm: 'binary-tree', 
      padding: 40, 
      cssFormat: 'scss', 
      engine: 'pngsmith', 
      cssOpts: { 
       functions: false, 
      }, 
     }, 

    }, 

}); 

У меня есть коллекция около 15-20 сайтов, так дублируя каждую задачу в два раза для стандартных и сетчатки глаза спрайтов вскоре раздутых мой Gruntfile. Javascript не является моей сильной стороной, поэтому каждое решение до сих пор не сработало.

Любая помощь будет оценена по достоинству.

Спасибо заранее!

ответ

0

вы заметите, что функция grunt.initConfig принимает литерал объекта в качестве входных данных, как таковой вы можете грамматически построить объект конфигурации перед передачей его в initConfig

что-то вроде

var _ = require('lodash'), 
    tasks = require('mytasks'), 
    abunchOftasks = require('anotherSetOfTasks'); 


var combined = _.merge(tasks, abunchOftasks) //a deep extend 

grunt.initConfig(combined) 

где require('mytasks') и require('anotherSetOfTasks') вернуть {} с кучей определенных задач, варов и т. д. Например:

//mytasks 
module.exports= { 
    sprite: { 
    normal: { 
     src: 'site1/images/sprite/1x/*.png', 
     destImg: 'site1/images/site1-sprite.png', 
     destCSS: 'styles/scss/site1/sprite/_spritesmith.scss', 
     algorithm: 'binary-tree', 
     padding: 20, 
     cssFormat: 'scss', 
     engine: 'pngsmith', 
     cssOpts: { 
      cssClass: function(item) { 
       return '.' + item.name; 
      }, 
     }, 
    }, 
    } 
}; 

//anotherSetOfTasks 
module.exports = { 
    sprite: { 
    retina: { 
     src: 'site1/images/sprite/2x/*.png', 
     destImg: 'site1/images/site1-sprite-2x.png', 
     destCSS: 'styles/scss/site1/sprite/_spritesmith-retina.scss', 
     algorithm: 'binary-tree', 
     padding: 40, 
     cssFormat: 'scss', 
     engine: 'pngsmith', 
     cssOpts: { 
      functions: false, 
     }, 
    }, 
    } 
}; 

EDIT Возможно, вы немного поняли, но основной принцип все еще применяется. вы можете создать функцию, которая генерирует задачу из имени сайта. Я бы запрограммировал массив имен, как вы предлагаете, и создайте новую часть конфигурации, а затем объедините каждый объект в один объект, используя свойство sprite. Имеет ли это смысл?