Где находится содержимое файла CSS уровня компонента после сборки проекта? - PullRequest
0 голосов
/ 04 апреля 2019

Я пытаюсь выучить их на Angular 7, используя SCSS.Мой подход заключается в том, чтобы сохранить скомпилированные минимизированные css-файлы в папке (например, активах) и щелкнуть по кнопке, добавить ссылку в заголовок страницы и переопределить тему.и нажмите другую кнопку, чтобы вернуть тему по умолчаниючто-то вроде:

    changeTheme() {
        let head = document.querySelector("head");
        let styleNode = document.createElement('link');

        styleNode.setAttribute('href', 'assets/mytheme.css');
        styleNode.setAttribute('rel', 'stylesheet');
        console.log(document.querySelector('link').href);
        document.querySelectorAll('link').forEach(a => {
            if (a.href.includes('http://localhost:4200/assets')) {
                head.removeChild(a);
              }
        })
        head.appendChild(styleNode);
      }

    changeToDefault() {
        let head = document.querySelector("head");
        let styleNode = document.createElement('link');
        document.querySelectorAll('link').forEach(a => {
            if (a.href.includes('http://localhost:4200/assets')) {
                head.removeChild(a);
              }
        })
    }

Это прекрасно работает, когда файлы scss находятся снаружи в отдельной папке, и я импортирую их все в глобальный файл scss.Проблема возникает, когда файлы scss находятся на уровне компонентов.В скомпилированном, уменьшенном окончательном файле css после сборки углового приложения, по-видимому, находятся только глобальные свойства css.Мой вопрос: где находятся свойства css уровня компонента, и мы можем не применять их, если файлы scss находятся на уровне компонента?

...