Size: a a a

Svelte [svelt] - All about Svelte JavaScript framework.

2021 November 04

MS

M S in Svelte [svelt] - All about Svelte JavaScript framework.
Генерация стилей на основе атомных стилей
источник

MS

M S in Svelte [svelt] - All about Svelte JavaScript framework.
Unocss как раз это умеет в числе прочего на первый взгляд
источник

A

Arushwl in Svelte [svelt] - All about Svelte JavaScript framework.
Что-то мне подсказывает, что на языке css это называется набор правил. Генерации эти… 😁
источник

A

Arushwl in Svelte [svelt] - All about Svelte JavaScript framework.
Но в такую штуку все атомики вроде умеют… windy точно, tw @apply… в uno как раз есть отсылки
источник

MS

M S in Svelte [svelt] - All about Svelte JavaScript framework.
Возможно. Смотрю сейчас. Как это со свелтом скрестить...
источник

A

Arushwl in Svelte [svelt] - All about Svelte JavaScript framework.
Даже прост sass умеет разворачивать правила в наборе: .class { .other, .some }
источник

MS

M S in Svelte [svelt] - All about Svelte JavaScript framework.
Упс. А я думал только через миксины. Если так можно, то и проблем нет и нечего мудрить. Scss свелт поддерживает.
источник

A

Arushwl in Svelte [svelt] - All about Svelte JavaScript framework.
С препроцессором
источник

MS

M S in Svelte [svelt] - All about Svelte JavaScript framework.
Ага. Все оказывается гораздо проще решается. Спасибо!
источник

MS

M S in Svelte [svelt] - All about Svelte JavaScript framework.
Полезнейшая штука. Странно даже что этого нет из коробки.
источник

A

Arushwl in Svelte [svelt] - All about Svelte JavaScript framework.
Обознался, сорри… это less умеет. В sass @mixin, @extend… а какая цель не пойму… переиспользовать наборы правил?
источник

DK

Dan Kozlov in Svelte [svelt] - All about Svelte JavaScript framework.
Ты про @extends директиву? Она в компонентах не работает.
источник

DK

Dan Kozlov in Svelte [svelt] - All about Svelte JavaScript framework.
Она не работает потому, что компилируются стили компонентов изолированно, а не весь проект разом. Поэтому если экстендить, надо будет импортировать. А импорт приведёт к дублям.
источник

A

Arushwl in Svelte [svelt] - All about Svelte JavaScript framework.
Импортировать что?
источник

DK

Dan Kozlov in Svelte [svelt] - All about Svelte JavaScript framework.
Стили, которые хочешь "экстендить". @extends по сути просто вместо .parent {} .child {@extends .parent} делает .parent, .child {} .child {}.
источник

DK

Dan Kozlov in Svelte [svelt] - All about Svelte JavaScript framework.
Это полезно при компиляции множества файлов .sass/.scss, но абсолютно бесполезно в свелт-компонентах. У него нет в контексте компонента стиля .parent, поэтому нечего экстендить.
источник

AP

Alexander Ponomarev in Svelte [svelt] - All about Svelte JavaScript framework.
эээх, а в цсс модулях все уже давно есть и работает
источник

A

Arushwl in Svelte [svelt] - All about Svelte JavaScript framework.
У меня вот так работает:

@import 'button'

.button-big {
 @extend .button,
 font-size: 100rem
}
источник

AP

Alexander Ponomarev in Svelte [svelt] - All about Svelte JavaScript framework.
лул
источник

DK

Dan Kozlov in Svelte [svelt] - All about Svelte JavaScript framework.
Да, так оно и будет работать. Ты же импортируешь стили button. Сделай это в 5 компонентах, у тебя будет 5 раз продублированы в каждом компоненте стили button.
источник