Подтвердить что ты не робот

Многие файлы SCSS/SASS в один файл CSS?

Можно ли заставить sass прослушивать каталог со многими sass файлами и генерировать один файл CSS? Я нашел способ включить много sass файлов в один (style.scss):

@import "scss/header";
@import "scss/footer";

Затем запустите следующий код:

sass --watch style.scss:style.css

но проблема в том, что я должен изменить этот файл перед созданием нового файла CSS.

4b9b3361

Ответ 1

Если вы смотрите каталог, sass сможет замечать изменения в @imported файлах и обновлять зависимые файлы.

style.scss:

@import "header";
@import "footer";

И выполните:

sass --watch .

Он скомпилирует все файлы в каталоге в .css; игнорируя файлы, имя которых начинается с _.

Я изменяю _header.scss или _footer.scss, если также обновит style.scss.

Вы также можете выводить в другой каталог:

sass --watch .:output_dir/

Ответ 2

Вы можете сказать SASS, чтобы посмотреть всю папку с помощью

sass --watch application/sass:public/stylesheets

Если вы импортируете все ваши частичные файлы, это должно сгенерировать один файл. Каждый раз, когда вы редактируете файл в папке, файлы CSS будут генерироваться автоматически.

Ответ 3

Просто хотел добавить, Вы также можете вызывать переменные ($) и Mixins из других файлов.

Пример:

_variable.scss = $primary:#000
_header.scss = header {color:$primary;}
_footer.scss = footer {background:$primary}

custom.scss:

@import "_variables.scss";
@import "_header.scss";
@import "_footer.scss";

Выход = custom.css

header {color:#000;}
footer {background:#000;}