Как я могу загружать разные стили для разных страниц в Angular 20, если все ресурсы тоже разные? [закрыто] ⇐ Html

[Anonymous]

В настоящее время я работаю над проектом Angular v20+ и столкнулся с проблемой на этапе начальной настройки.
В моем проекте есть две разные части пользовательского интерфейса:
Главная (целевая страница и связанные общедоступные страницы)
Панель управления (раздел «Пользователь/Администратор»)
Обе имеют отдельные наборы ресурсов — то есть свои собственные CSS, JS, jQuery, Bootstrap и другие файлы ресурсов.
Структура папок выглядит примерно так:

Код: Выделить всё

/src/assets/
/home/
css/
js/
images/
/dashboard/
css/
js/
images/

Однако проблема в том, что некоторые классы CSS и имена функций JS одинаковы в обоих наборах.
Когда я включаю оба класса в приложение Angular (даже если они хранятся в разных папках), они конфликтуют друг с другом, что приводит к полной поломке пользовательского интерфейса.
До сих пор я пробовал:
Отложенную загрузку стилей и скрипты
Динамическая загрузка ресурсов через сервисы Angular
Использование внедрения скриптов на уровне компонентов
Рендеринг и размонтирование логики с условной загрузкой ресурсов
Несмотря на множество подходов, мне все еще не удается изолировать оба раздела пользовательского интерфейса без конфликтов.
Я хочу загружайте ресурсы Home и Dashboard независимо —
чтобы при переключении между маршрутами соответствующие CSS/JS загружались и выгружались аккуратно, не мешая друг другу.
Кто-нибудь обрабатывал подобную структуру — или может поделиться передовым опытом или примером GitHub о том, как управлять несколькими темами или макетами пользовательского интерфейса (с отдельными ресурсами) в одном проекте Angular v20+?

Подробнее здесь: https://stackoverflow.com/questions/797 ... when-all-a