Как предотвратить переименовывание классов в Webpack Angular?
Я подключил файл стилей с описанием классов глобально в angular.
Если страницу написать целиком в одном файле, то весь дизайн работает.
Если же я создам компонент и часть данных перенесу в него и подключу его в разметке, то часть стилей теряются- вообщем дизайн плывёт.
Не понимаю- почему . Может ли быть, что webpack переименовывает классы и затем я хочу применить к элементу класс myclass - то он переименуется до другого и класс и стили не применятся?
Если да- то как быть с этим?
Если нет- то что может ещё быть, что объяснит, почему внутри компонента классы не работают, когда если вынести разметку в файл высшего уровня, где подключен глобальный файл стилей- то всё работает.
Ответы (1 шт):
Используйте encapsulation: ViewEncapsulation.None свойство в декораторе @Component. Это убирает инкапсуляцию стилей с уровня компонента до глобального.
По умолчанию, Angular замыкает стили на уровень компонентов с помощью добавления сгенерированного атрибута, например: [_nghost-abs-c10]. Читайте тут