Я занимаюсь рефакторингом приложения Angular и, перемещая компоненты в новые каталоги, я нахожу, что обработка путей @import
в файлах SCSS компонентов становится немного утомительной.
Например, допустим, у меня есть файл src/_mixins.scss
в корне моего приложения, а компонент src/app/my-widget/my-widget.component.scss
импортирует SCSS как @import '../../mixins';
, Все хорошо.
Но затем я решаю, что my-widget.component
действительно является "разделяемым компонентом" в другом компоненте my-thingy.component
, поэтому я создаю shared
папку в src/app/my-thingy
и перемещаю все, что было в src/app/my-widget
в него.
Я надеюсь, что вы все еще со мной... Итак, теперь у меня есть src/app/my-thingy/shared/my-widget
и я @import '../../../../mixins'
свой файл SCSS для импорта @import '../../../../mixins'
.
Примечание. Это упрощенный пример. Некоторые пути становятся относительно глубокими (не каламбур... или не так?) И все это .
и /
немного много.
TL; DR
Было бы очень удобно, если бы с самого начала я мог просто импортировать _mixins.scss
относительно корня во все файлы SCSS моих компонентов, чтобы мне не приходилось @import
путями @import
при рефакторинге. (Например, что-то @import '~/mixins'
). Существует ли что-то подобное?
Что я пробовал (и, к сожалению, не получилось):
-
@import '~/mixins';/** я had real hope for this one **/
-
@import 'mixins';/** Just being overly optimistic here **/
-
@import '~//mixins';/** Now I'm just making stuff up **/
Я понимаю, что мне уже придется изменить мои файлы модов, чтобы они указывали на новый путь компонента со всеми этими "движущимися вещами", но... эй, еще одна вещь, верно?