Получите SASS для (автоматической) компиляции из определенных файлов в разные папки

У меня есть /source/sass/skin1_settings.scss, который содержит импорт из /vendors/foundation/, некоторые настройки для этого стиля и файл app.scss. Я хочу, чтобы мой node.JS скомпилировал его непосредственно в /skin/skin1/css/app.css, как мне это сделать?

Примечание. То же самое и со вторым стилем.

Я использую node-sass-middleware, чтобы использовать node-sass с Express.

app.use(
 sass({
     src: [sass_folder], 
     dest: [css_folder],
     debug: true,       
 })
);   

А вот моя древовидная структура, спасибо.

./    
    +--vendors/                 <-- Third-party libs from external vendors
        +--jquery/         
        +--foundation/     
        +--angularjs/      
        +--modernizr/      

    +--source/
        +--sass/                        <-- custom stylesheet (not present on the prod server)
            +--skin1_settings.scss
            +--skin2_settings.scss
            +--app.scss

    +--skin/
        +--skin1/
            +--img/             <-- imported images (..@2x, ..@3x)  
            +--css/             <-- generated stysheet

        +--skin2/
            +--img/             <-- imported images (..@2x, ..@3x)  
            +--css/             <-- generated stysheet

    +--html/                    <-- HTML Mockups
        +--...

person Allan Stepps    schedule 27.10.2014    source источник
comment
Вам стоит заглянуть в эту ветку. Я не использовал его сам, но я нашел несколько сайтов, говорящих примерно то же самое. Удачи! stackoverflow.com/questions/8535336/   -  person PatrikJarl    schedule 28.10.2014


Ответы (1)


Чтобы сделать автоматическую компиляцию SASS в CSS, часто выбирают: используйте Compass или Grunt с libsass (на основе node.js), я бы рекомендовал использовать последний, вам просто нужно:

  • Установите Grunt.
  • Установите libsass (также можно использовать плагин grunt-contrib-sass)
  • Настройте файл конфигурации grunt для проекта, здесь вы указываете, куда вы хотите скомпилировать каждый файл CSS (проверьте страницу libsass выше, там есть примеры конфигурации).

Когда вы собираетесь работать над проектом, просто используйте конфигурацию grunt для просмотра файлов и все, редактируйте свои файлы, а grunts выполняет компиляцию (при необходимости вы можете следить за ошибками в консоли).

Надеюсь, это поможет вам.

person Jesus Lugo    schedule 22.01.2015