0

Мой сайт Структура файла что-то вроде этого:Dynamic Grunt Часы конфигурации

app 
    less 
     themes 
      default 
      modern 
      etc 
public 
    themes 
     default 
      css 
     modern 
      css 
     etc 

Так /app/less/themes/{{ themeName }}/*.less будет компилировать в /public/themes/{{ themeName }}/css/*.css.

У меня есть моя задача Grunt Less, настроенная динамически и работающая нормально. Пример: grunt less:compileTheme:modern

less: { 
    compileTheme: { 
    options: { 
     compress: false, 
     yuicompress: false, 
     optimization: 2, 
     sourceMap: true, 
     sourceMapFilename: "public/themes/<%= grunt.task.current.args[0] %>/css/styles.css.map", 
     sourceMapURL: "/themes/<%= grunt.task.current.args[0] %>/css/styles.css.map" 
    }, 
    files: { 
     "public/themes/<%= grunt.task.current.args[0] %>/css/styles.css": "app/less/themes/<%= grunt.task.current.args[0] %>/styles.less" 
    } 
    } 
} 

Но я не уверен, как получить задание работать Grunt Watch. В идеале, он будет видеть название папки темы и запустить черновую задачу как grunt less:compileTheme:{{ themeName }}:

watch: { 
    themeCss: { 
     files: "app/less/themes/{{ themeName }}/**/*.less", 
     tasks: ["less:compileTheme:{{ themeName }}"], 
     options: { 
      spawn: false 
     } 
    } 
} 

Возможно ли это? И/или есть лучший способ, которым я должен это делать?

ответ

1

редактировать ваши часы задача запустить less:compileTheme -task без THEMENAME, и смотреть все меньше файлов в папке темы:

watch: { 
    themeCss: { 
     files: "app/less/themes/**/*.less", 
     tasks: ["less:compileTheme"], 
     options: { 
      spawn: false 
     } 
    } 
} 

теперь вы можете добавить часы обработчика событий, где вы получите измененный файл. извлечь THEMENAME, а также настроить менее задачу:

grunt.event.on('watch', function(action, filepath) { 
    var themeName = filepath.split('/')[3]; 
    grunt.config('less.compileTheme.files', { 
    "public/themes/" + themeName + "/css/styles.css": "app/less/themes/" + themeName + "/styles.less" 
    }); 
}); 

конечно обнаружение вашего THEMENAME должно быть более надежным, но я думаю, вы получите представление о том, как сделать динамическое наблюдение!

+0

Спасибо. Я получаю сообщение об ошибке: «Неожиданный токен« + »в первом« + themeName + » Я попытался сделать объект строкой, но это тоже не сработало. – dmathisen

+0

Ничего, я тупой. Это стандартный JS, и вы не можете иметь свойство объекта как такую ​​переменную. Поэтому мне просто нужно использовать obj [prop] = val; но это все хорошо. Благодаря! – dmathisen