Импорт стилей в файлы ts с помощью angular 11

У меня есть приложение Angular 11, в котором я использую Webpack 5 и Module Federation через компоненты angulararchitects для создания приложения микрофронтенда. Чтобы сделать анимацию такой, какой я хочу, мне нужно что-то в scss, а что-то в angular. Чтобы иметь возможность иметь конфигурацию для этих анимаций в одном месте (переменные scss), я хотел бы экспортировать их и использовать их через импорт в моих компонентах angular. Я прочитал несколько статей о том, как это было бы возможно, но поскольку способ обработки модулей css был изменен в Angular 11, а также с наличием webpack.config и настраиваемого конструктора с использованием angulararchitects, я немного застрял в том, как выполнить это.

Что у меня есть на данный момент:

  • экспортировать мои переменные в файлы scss
  • создать файл ввода для переменных

Где я застрял:

  • Где включить файл набора с помощью ngx-builder-plus (я вижу, что есть включение всех файлов .d.ts, но я не уверен, что этого достаточно)
  • Как настроить webpack с angular 11, чтобы переменные правильно экспортировались

Есть идеи или направления? Спасибо Маркус


angular angular11 webpack-5 css-modules webpack-module-federation
person Markus Bio-Alexander    schedule 23.12.2020    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Если вы хотите обрабатывать условный стиль, лучшим способом было бы обрабатывать его динамически с помощью директивы ngClass. ИЛИ Если вам необходимо создать архитектуру на основе нескольких тем, обратитесь к SASS / Многотемный подход SCSS

person Himanshu Saxena    schedule 23.12.2020
comment
Здравствуйте, я знаю о ngClass, а также о Темах в целом. Но в основном это все об анимации, где мне нужна специальная обработка angular для входа и выхода компонентов. Для всего остального я хочу иметь обычные css-анимации, и для того, чтобы иметь только один набор констант для разных значений, мне понадобятся они в scss, а также в файлах компонентов ts. - person Markus Bio-Alexander; 23.12.2020