Про "Element is resolved only by name without use of explicit imports" в WebStorm/PhpStorm

Небольшой пост для пользователей WebStorm/PhpStorm: полагаю, многие из вас, кто работал с препроцессором SASS/SCSS, попадал в следующую ситуацию:

1. У вас есть файл, в котором прописаны переменные SASS/SCSS, использующиеся в большом количестве фрагментов кода, — назовем его _variables.scss.
2. У вас есть файл, в котором прописаны стили для определенного блока, — назовем его _block.scss.
3. Наконец, есть файл styles.scss, который импортирует _variables.scss и _block.scss:

@import _variables.scss;
@import _block.scss;

Если мы, находясь в файле _block.scss, попытается обратиться к переменной, например, $light-text, которая была объявлена в

_variables.scss

, IDE выдаст предупреждение вида "Element 'light-text' is resolved only by name without use of explicit imports" (хотя SCSS-код будет прекрасно работать). Как поступить в такой ситуации? Ответ прост — достаточно выключить это предупреждение в настройках IDE. Для этого нужно:

1. Перейти в File -> Settings.
2. Раскрыть раздел Editor и найти пункт Inspections.
3. Найти Sass/SCSS в Inspections.
4. Снять галочку с Missing import (или Resolved by name only в более старых версиях).

Готово! Теперь можно наслаждаться работой с Sass/SCSS без надоедливых предупреждений.

#кодинг
#scss
#ide
#webstorm