Как корректно настроить csscomb для saas?

Question

[privat13]

Добрый день, коллеги.

Настраиваю csscomb для vs code.
Столкнулся с трудностями. Возможно кто-то уже решил.

Неверно корректирует вложенность. Из вложенности третьего уровня делает первый уровень.
Также классы и их свойства может поставить в одинаковым отступом

Стили используются внутри файлов .vue. Даже если использую csscomb внутри файлов sass, то проблема остается. Прошу обратить внимание на нижней класс .label. Он некорректно встает

// Верхние табы
.tabWrapper
	+flex($align-content: center)
	gap: .1rem
	padding: .4rem 2rem 0
	background-color: var(--brand2-25) 

	.tabItem
		+flex($justify-content: space-between, $align-items: center)
		gap: .2rem
		padding: .5rem .8rem
		border-top-left-radius: .5rem 
		border-top-right-radius: .5rem 
		background-color: var(--brand2-50)
		cursor: pointer

		&:hover
			background-color: var(--brand1-35)
			transition: .2s

			.label
				color: var(--text)
				transition: .2s

		.label 
			color: var(--grey400)
			font-size: 1.1rem
			cursor: pointer

Если дважды запускаю csscomb, то выдается ошибка
Error: Cannot find module '../package.json'

Comments

[Сергей delphinpro]

Здесь смотрели Как использовать в Sublime 2 CSScomb 3 для SASS? ?

[Ankhena]

А я бы ещё пересмотрела необходимость такой вложенности.

Вряд ли .tabItem существует и не внутри .tabWrapper
Стили .label, которые внутри hover вполне можно заменить на кастомные свойства.

[privat13]

Сергей delphinpro, для этой штуки мозгов не хватает(((

[Сергей delphinpro]

privat13, может он с нормальным синтаксисом (scss) хорошо работает? Все эти indent-извращения давно пора забыть...

Answer 1

[artem]

1. проверьте конфигурационный файл csscomb. возможно, он неправильно настроен для работы с вложенными стилями в .vue и sass.
   
2. попробуйте обновить csscomb или использовать другой инструмент для форматирования, например prettier.
   
3. проблема с ошибкой "cannot find module" может быть связана с неправильным путем к файлам в настройках проекта. проверьте пути и зависимости в вашем package.json.