Задать вопрос
@ymfront

Имеет ли смысл использование SCSS при именовании классов по BEM?

Есть такой SCSS-код (вложенность блоков с именованием классов по BEM):

.banner {
	свойства
	&__text {
		свойства
	}
	&__img {
		свойства
	}
}


Есть ли смысл в таком написании стилей, использую вложенность при именовании классов по BEM?
Или лучше делать без вложенности?

.banner {
	свойства
}

.banner__text {
	свойства
}

.banner__img  {
	свойства
}


Т.к. например, при правке стилей класс найти проще, если стили написаны без вложенности.
  • Вопрос задан
  • 228 просмотров
Подписаться 1 Простой 4 комментария
Пригласить эксперта
Ответы на вопрос 4
Psychosynthesis
@Psychosynthesis
Fullstack developer and radio engineer
Во всех больших проектах, в которых я работал, использовали первый вариант.

Как тут верно заметили - искать нужный стиль, при таком подходе по всей кодовой базе может быть не удобно или даже вообще нереально в некоторых случаях. Все россказни про "один файл - один класс" это тоже бред... Бывает так что компонентов в проекте тысяча и невозможно знать какой конкретно компонент рисует нужный элемент. А как его искать непонятно, потому что там может не быть строк, например.

Что касается моего мнения, так БЭМ это в принципе шизофрения, эти нижние слэши делают из стилей мусор.
Ответ написан
shura812
@shura812
I'm only study html,css!
BEM имеет смысл!
Ответ написан
Get-Web
@Get-Web Куратор тега HTML
Front-End Developer
Лично мне использование амперсанда принесло больше вреда чем пользы, поэтому я придерживаюсь второго варианта:

.banner {
  свойства
}

.banner__text {
  свойства
}

.banner__img  {
  свойства
}

Даже если каждый блок разбит на отдельные файлы поиск в самом файле намного проще, при этом можно использовать глобальный поиск по проекту и сразу переходить к нужному классу.

Но SCSS это не только амперсанд, поэтому одно другому не мешает, хотя я использую только postCSS
Ответ написан
delphinpro
@delphinpro Куратор тега HTML
frontend developer
Т.к. например, при правке стилей класс найти проще, если стили написаны без вложенности.


Почему? Если вы придерживаетесь правила - один класс- один файл, то вам всего лишь нужно кликнуть по селектору блока и вы перейдете в нужный файл. А там найти элемент не сложно.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы