RSS

SASS + Compass под Windows: установка, настройка, работа

19 Июн 2013

Начав работать с SASS, столкнулся с ситуацией, когда непонятно с чего начать. Возможно это небольшое пошаговое руководство облегчит кому-то жизнь.

1. Для начала нужно установить Ruby

Берём инсталлер последней версии: http://rubyinstaller.org/downloads/
На этапе установки не забываем отметить пункт Add Ruby executables to your PATH

Add_Ruby_executables_to_your_PATH

2. Теперь нужно установить SASS + Compass

Для этого нужно открыть командную строку и последовательно выполнить следующие команды:
gem install sass
gem install compass

gem_install

3. SASS установлен, теперь нужно подготовить его для работы с проектом

Для этого в директории с нашим проектом необходимо выполнить команду:
compass init
Будет создан файл с конфигом для Compass и директории для файлов SASS и CSS.

compass_init

Теперь нужно отредактировать файл конфига config.rb, прописав там правильные пути к нашим папкам с SASS, CSS, JS и картинками.

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

4. Всё готово, можно работать.

В директории sass создаём файл/файлы с расширением .scss, в него пишем наш SCSS код.

Для того, чтобы Compass отслеживал изменения в этих файлах, и автоматически генерировал из них CSS, необходимо в корне проекта (там, где лежит файл с конфигом) выполнить команду:
compass watch
compass_watch

Появившееся консольное окно не закрываем до окончания работы с файлами SASS.

5. Profit!

Комментировать:

 

 
  1. Ilhom

    11 марта 2014 at 14:25

    Большое спасибо! Помогло.

     
  2. SergeyBRSA

    22 июня 2014 at 21:55

    Спасибо. Хороший материал.

     
  3. Korsar

    16 июля 2014 at 00:45

    То что нужно =)

     
  4. mutkoc

    27 октября 2014 at 18:48

    Почему бы всем без линуксоподобного языка вот так вот не разжёвывать? Спасибо!

     
  5. Владимир

    3 декабря 2014 at 12:03

    Спасибо за руководство. Подскажите плз, что можно предпринять при этом http://clip2net.com/s/joTynv
    Тупик?

     
  6. RAD

    3 декабря 2014 at 14:02

    Владимир, не знаю чем тут помочь, увы. :(

     
  7. ttargus

    18 февраля 2015 at 18:09

    Кто-то сталкивался с ошибкой после команды gem install sass
    ERROR: Could not find a valid gem 'sass' (>= 0), here is why:
    Unable to download data from https://rubygems.org/ - SSL_connect returned=1 errno=0 state=SSLv3 read server certificate B: certificate verify failed (https://api.rubygems.org/latest_specs.4.8.gz)

     
  8. RAD

    19 февраля 2015 at 01:32

    ttargus, похоже проблема с сертификатом SSL на rubygems.org, я решил эту проблему так:
    gem install sass --source http://rubygems.org
    gem install compass --source http://rubygems.org

     
  9. Антон

    28 сентября 2015 at 10:23

    Круто! Мы пишем на RoR на линуксе соответственно, но начальную верстку я делаю на винде(из-за photoshop’a с лицензией), не хватало мне здесь sass очень-очень! теперь буду писать все, как надо, и не придется переписывать больше)))

     
  10. Евгений

    23 марта 2016 at 11:10

    Здравствуйте. У меня при установке выдает ошибку

    C:\Users\Евгений>gem install sass
    ERROR: Could not find a valid gem ‘sass’ (>= 0), here is why:
    Unable to download data from https://rubygems.org/ – Errno::ECONNREFUS
    ED: No connection could be made because the target machine actively refused it.
    – connect(2) for “api.rubygems.org” port 443 (https://api.rubygems.org/specs.4.8
    .gz)
    Я попробовал решить проблему так:
    gem install sass –source http://rubygems.org

    Но в моей конторе стоит прокси сервер и программа не устанавливается, а выдает ошибку:

    d:\Program Files\Ruby22>gem install sass –source http://rubygems.org
    ERROR: Could not find a valid gem ‘sass’ (>= 0), here is why:
    Unable to download data from https://rubygems.org/ – Errno::ECONNREFUS
    ED: No connection could be made because the target machine actively refused it.
    – connect(2) for “api.rubygems.org” port 443 (https://api.rubygems.org/specs.4.8
    .gz)
    Unable to download data from http://rubygems.org/ – Errno::ECONNREFUSE
    D: No connection could be made because the target machine actively refused it. –
    connect(2) for “api.rubygems.org” port 80 (http://api.rubygems.org/specs.4.8.gz

    Возможно ли как то еще ее установить?

     
  11. RAD

    23 марта 2016 at 11:16

    Евгений, к сожалению не могу помочь вам с вашей проблемой. :(

     
  12. Евгений

    23 марта 2016 at 12:18

    Я нашел инструкцию
    http://stackoverflow.com/questions/4167424/how-can-i-run-sass-without-installing

    Install Ruby
    Download the Sass Gem
    Navigate to download location
    Run: gem install sass-3.3.4.gem
    Voila! Sass is installed.

    Скачал с сайта sass начал установку но даже так не получается… что еще моно сделать?

     
  13. RAD

    23 марта 2016 at 12:25

    Есть подозрение, что проблема в прокси-сервере. К сожалению ничего не могу подсказать.

     
  14. Евгений

    26 марта 2016 at 13:55

    В дополнение к выше сказанному в статье.
    !! В адресе на проект не должно быть кириллицы. Иначе ruby не видит куда скомпилиованый css складывать и будет выдавать ошибки.
    Сегодня столкнулся с данной проблемой для Windows 7. Правда ставил не через командную строку, а ставил compass.app для коллеги. Пока в cmd не залез, не понял в чем проблема)) Может кому будет полезно…

     
  15. pinkygirl

    27 марта 2016 at 13:20

    Здравствуйте! Скажите пожалуйста, можно ли sass установить на хостинг? Я работаю с файлами напрямую с хостинга по winscp.

     
  16. Евгений

    29 марта 2016 at 05:28

    Здравствуйте. Я все установил. compass. но когда я пишу команду compass init ничего не появляется… в чем проблема?