在自定义角度库中使用Postcss

问题描述 投票:4回答:1

我使用postcsspostcss-css-modulesposthtml-css-modules在Angular应用程序中实现CSS模块。我还使用@angular-builders/custom-webpack实现了这一目标。

现在,我想对我的自定义角度库执行相同的操作。但是,我无法使用@angular-builders/custom-webpack,因为Angular Libraries是使用ng-packagr构建的。

因此,@angular-builders/custom-webpack无法使用:https://github.com/just-jeb/angular-builders/issues/356

另一方面,ng-packagr不支持postcsshttps://github.com/ng-packagr/ng-packagr/issues/1471

我已经阅读到可以在rollup中扩展ng-packagr配置(在编译结束时使用ng-packagr的编译器:

https://github.com/ng-packagr/ng-packagr/blob/master/docs/DESIGN.md#rollup-config

但是我没有找到任何文档来实现这一目标。

有人知道怎么做吗?

我认为的其他解决方案是,将所有样式都设置为全局样式,并像在这里一样使用scss-bundle和postcss对其进行编译:NodeJs Script that compiles scss files fails because of postcss rule for undefined variables

如果我可以使用lodash,我将能够用其散列的类名替换类名,就像这里建议的:Use [hash:base64:5] in JavaScript / TypeScript file

但是要做到这一点,我将需要知道如何在ng-packagr的版本中调用lodash。

有人知道该怎么做吗?

欢迎任何其他解决方案。

谢谢。

angular webpack postcss rollupjs ng-packagr
1个回答
0
投票

已经有关于此增强功能的讨论。可能仍在进行更改。您可以从here

进行跟踪

您可以预处理您的样式,然后按照此article的建议传递给ng-packagr>

与HTML文件一起嵌入的其他问题,您可以使用这些this来创建类似于tools的生成后过程,>

我希望这能解决您的问题。

© www.soinside.com 2019 - 2024. All rights reserved.