Живое preview на SASS без компиляции?

Question

[Capablanca]

Всем доброго дня.

Думаю, многие привыкли работать над проектами, через live-preview для вашего html внутри редактора или сразу в окне браузера.
Но это работает только с привязанным чистым .css файлом. Для пре-процессоров .sass файл сначала должен быть скомпилирован в css, иначе так работать не получится.
Можно ли как-то настроить авто-компиляцию из SASS, чтобы я мог смотреть изменения вживую в браузере, редактируя при этом только SASS-документ?
Желательно именно для редактора Atom.

Буду рад советам.

Answer 1

[Александр]

Не страдайте ерундой. Собирайте проект с помощью gulp+gulp-sass и browsersync или webpack+sass-loader

Comments

[Capablanca]

Спасибо.
Но в таком случае я смогу в live режиме в браузере видеть все изменения, редактируя только SASS?

[sim3x]

Capablanca, да

Сборка происходит за доли секунды

Answer 2

[Max Medar]

Смотрите watcher-ы. Они мониторят изменения файлов и запускают ваши таски на выполнение. Например, ватчер увидел, что sass файл изменился - запустил таск компиляции - обновил css в браузере. Механизм ватчеров отлично реализован в gulp, также есть в phpstorm, наверняка есть и в atom.

Без проблем и загуглилось - https://atom.io/packages/atom-watcher

Comments

[Capablanca]

Я тоже гуглил, но видимо совсем не в этом направлении.
Нашлась какая-то дичь, типа этого https://github.com/sass/sassc к нему еще нужен libsass, и я вообще не понял как это установить и что делать)

Благодарю вас за ответ, воспользуюсь вашим решением!

[Max Medar]

И как вы компилируете sass? В любом случае компиляция происходит благодаря libsass. Все остальное обертки.

[Capablanca]

Max Medar, тогда как поставить libsass?) нужна инструкция на человеческом языке