Как сгенерировать css из sass в bulma.css

Это мой первый раз, когда я работаю с scss, хотя я запускал команду в терминале для преобразования простого input.sass в output.css в случае других библиотек, это кажется немного сложным, так как это новое для меня.

У меня есть профиль с index.html, для которого требуется style.css, но мне нужно, чтобы этот style.css был сгенерирован из каталога bulma, который в настоящее время находится в этот формат.

index.html 
vendors
    bulma
       css
          bulma.css
          bulma.css.map
        sass
            base
              _all.sass
              generic.sass
              helpers.sass
              minireset.sass
            components
            elements
            grid
            layout
            utitlities
            bulma.sass

Проблема здесь в том, что, в отличие от примера sass input.scss output.css, который конвертирует файлы scss в css, приведенный выше пример кажется сложным.

Я не знаю, какой файл конвертировать, или мне следует изменить файл sass и изменить их, но сохранить ли я вывод в отдельном файле css или в одном мастер-стиле...

это все запутанно, и надеюсь, что кто-то знает путь к нему


css sass bulma css-preprocessor
person user7342807    schedule 22.02.2017    source источник

Ответы (1)


arrow_upward
2
arrow_downward

в каждом каталоге sass, таком как база, компоненты и т. д., все они имеют _all.sass файл. которые включают все файлы в этом каталоге. Итак, все, что вам нужно, это включить один файл _all.sass из каждой папки в папке sass.

Итак, в вашем файле sass, который вы будете смотреть с помощью sass gem, включите все файлы _all.sass. Что-то вроде этого сработает.

@import "utilities/_all"
@import "base/_all"
@import "elements/_all"
@import "components/_all"
@import "grid/_all"
@import "ayout/_all"

Кроме того, я не уверен на 100%, но я думаю, что смешивать sass с scss — плохая идея, поэтому я бы посоветовал сделать что-то вроде этого:

В папке sass вашего проекта создайте файл sass и назовите его styles.sass. В этом файле запись импортируется во все файлы _all.sass.

А затем просто сделайте это в терминале: sass --watch sass:css

person ivan marchenko    schedule 22.02.2017
comment
Спасибо +1, но у меня есть еще один вопрос, который мне не ясен. Я понимаю, что вы сказали, и я должен включить все _all.sass из файлов каждого компонента, но куда? У меня есть public_html/css/style.css, в каком каталоге должен жить этот styles.sass? - person user7342807; 23.02.2017
comment
Итак, public_html/css/style.css — это ваша целевая таблица стилей. В вашей исходной таблице стилей, которая styles.sass включает все файлы _all.sass. и когда вы скомпилируете, весь этот код будет в вашей целевой таблице стилей. Взгляните на репозиторий bulma на GitHub, особенно на bulms.sass. - person ivan marchenko; 23.02.2017
comment
Извините, это не сработало. У меня установлены gem и sass, но когда я делаю `sass input.scss output.css`, как показано в sass-lang .com/guide Я получаю ошибки, что какой-то цвет не определен и !is not valid. Для получения дополнительной информации я создал файл styles.sass (пробовал использовать scss) внутри каталога vendors/bulma/sass/, и в этом файле у меня есть только команда @import "bulma", но затем я сделал `sass styles.scss style.css`, но безрезультатно. кроме ошибки. Посмотрим, сможет ли кто-нибудь это исправить - person user7342807; 23.02.2017
comment
может быть, это stackoverflow.com/questions/42417918/ поможет? - person user7342807; 23.02.2017