Селекторы подстановочных знаков в пути css для grunt-contrib-compass

Я пытаюсь использовать grunt-contrib-compass для проекта AngularJS с несколькими папками приложений. Вот моя базовая структура каталогов:

/root
   /appA
   /appB

   ...

   /appX
     /public
         /modules
             /moduleName
                 /css
                 /sass

gruntfile.js хранится в /root

Моя задача компаса настроена следующим образом:

compass: {
    dev: {
        options: {
            cssDir: 'app*/public/modules/**/css',
            sassDir: 'app*/public/modules/**/sass',
            outputStyle: 'compressed'
        } 
    }
}

Обратите внимание на селекторы с подстановочными знаками (*) в «cssDir» и «sassDir».

Когда эта задача запускается, она успешно находит файлы .scss в каталоге, указанном для «sass». Однако при создании файлов .css создается новая структура папок в /root следующим образом:

/root
   /app*
       /public
           /modules
               /**
                 /css

Папка «css» остается пустой, а фактический файл .css сохраняется в том же каталоге, что и мои файлы .scss.

Например, это вывод терминала для одного из файлов .scss при запуске задачи компаса:

>> File "appStudentHousing/public/modules/studentHousingHome/sass/styles.scss" changed.
Running "compass:dev" (compass) task
directory appStudentHousing/public/modules/studentHousingHome/sass
write appStudentHousing/public/modules/studentHousingHome/sass/styles.css (0.003s)

Похоже, что задача распознает селекторы с подстановочными знаками в опции «sassDir», но не распознает их в опции «cssDir». Он создает пустую структуру папок со звездочками в фактическом имени папки, а затем по какой-то причине сохраняет выходной файл .css в той же папке, что и файл .scss.

Большое спасибо за любую информацию, которую вы можете предоставить.


person MattSidor    schedule 10.12.2014    source источник
comment
Если я правильно понимаю, вы не можете использовать шаблоны подстановки в параметрах cssDir и sassDir, потому что плагин Compass Grunt может компилироваться только в один каталог для каждой заданной цели.   -  person Timusan    schedule 10.12.2014
comment
Простите меня, я все еще новичок в Grunt. Что является заданной целью в этом случае?   -  person MattSidor    schedule 10.12.2014
comment
А, нет проблем. Данной целью здесь является dev. Grunt всегда определяет свои задачи как саму задачу, compass в данном случае, и несколько целей для задачи. Вы можете пойти дальше и определить другие цели, помимо dev (кстати, ее также не нужно называть dev). Чтобы вызвать конкретную цель задачи, вы вызываете ее с помощью grunt task:target. В вашем случае grunt compass:dev. Простой запуск grunt compass также работает здесь, потому что у вас определена только одна цель.   -  person Timusan    schedule 10.12.2014
comment
Хорошо, теперь я понял! Я не понял, что это была цель. Итак, все, что мне нужно сделать, это указать разные цели для каждой папки appX, а затем я могу настроить уникальную задачу grunt-contrib-watch для каждой цели с явно заданными путями к папкам sass/css — подстановочные знаки не нужны. Большое спасибо Тимусан. Если вы опубликуете свой комментарий как ответ, я отмечу его зеленой галочкой.   -  person MattSidor    schedule 10.12.2014
comment
Дополнительная информация о целях grunt: gruntjs.com/configuring-tasks#task-configuration- и-цели   -  person MattSidor    schedule 10.12.2014
comment
Рад, что смог помочь. Я преобразовал свои комментарии (с небольшими дополнительными пояснениями) в ответ. Базовым обходным решением действительно будет указание разных целей для ваших каталогов, пока плагин compass не будет поддерживать несколько подстановок каталогов. Плагин watch действительно работает точно так же (на самом деле это функциональность, предоставляемая Grunt, поэтому все плагины имеют возможность множественного назначения). Вы можете указать разные цели для автоматического просмотра и запуска компиляции при изменении файла.   -  person Timusan    schedule 11.12.2014


Ответы (1)


Мои комментарии превратились в ответ:

В настоящее время плагин compass grunt может обрабатывать только отдельные каталоги для каждой цели, поэтому подстановка, которая соответствовала бы нескольким каталогам, отсутствует.

Чтобы обойти это ограничение, у вас всегда есть возможность создать несколько targets внутри вашей compass задачи (функция Grunt). target является подразделением task и может использоваться для настройки различных сценариев выполнения.

Два разных targets для плагина compass могут выглядеть примерно так:

compass: {
    dev: {
        options: {
            cssDir: 'app/dev/modules/css',
            sassDir: 'app/dev/modules/sass',
            outputStyle: 'compressed'
        } 
    },
    live: {
        options: {
            cssDir: 'app/live/modules/css',
            sassDir: 'app/live/modules/sass',
            outputStyle: 'compressed'
        } 
    }
}

Это даст вам два targets, dev и live, которые определяют разные параметры. Чтобы выполнить каждый target по отдельности, вы просто вызываете их в своей командной строке следующим образом:

$ grunt compass:dev
$ grunt compass:live

Именование target полностью зависит от вас, нет никаких строгих соглашений, которым нужно следовать. Если у вас есть один target для вашего task, то запустите задачу следующим образом:

$ grunt compass

Выполняет сингл target. Вам не нужно явно указывать его. Однако, если у вас есть несколько targets в вашем task, то Grunt должен выполнить все их по порядку при запуске с вышеуказанной командой.

И, как вы сами убедились, официальная Grunt документация дает вам больше подробная информация о tasks и targets.

person Timusan    schedule 10.12.2014
comment
Спасибо Тимусан!! Ты Раук! \м/ - person MattSidor; 11.12.2014