Webpack css-loader: как импортировать файл в конкретное место кода? - PullRequest
Новая
       11

Webpack css-loader: как импортировать файл в конкретное место кода?

0 голосов
/ 01 февраля 2019

Чтобы использовать угловую инкапсуляцию стилей для определенных частей приложения, я хочу загрузить css-загрузчиком стили из другого файла в другое место с сохранением структуры файла верхнего уровня.В моем файле .less есть код, подобный следующему: 

:host ::ng-deep {
    @import '~ag-grid-community/dist/styles/ag-grid.css';
    @import '~ag-grid-community/dist/styles/ag-theme-balham.css';
}

Суть в том, чтобы использовать меньший синтаксис для добавления префикса :host ::ng-deep к каждому правилу в импортируемых файлах.Однако структура не сохраняется, поэтому она работает так, как если бы файлы были импортированы за пределы внешнего селектора.в конце концов, после использования require(css-loader!./myfile.less).toString() это работает так: 

@import '~ag-grid-community/dist/styles/ag-grid.css';
@import '~ag-grid-community/dist/styles/ag-theme-balham.css';

:host ::ng-deep {
}

с импортом, замененным их содержимым.

Текущий стек загрузчиков: css-loader, postcss-loader и less-loader.

Есть ли способ сохранить структуру с текущими загрузчиками?Если нет, по вашему мнению, как лучше решить эту проблему?

...