目标是将组件模块创建为Angular 库，并将其与主应用程序分开。因此，组件库作为独立包发布到 NPM，然后可以导入到不同的应用程序中。使用 Tailwind 实用程序编写的组件样式@apply- https://tailwindcss.com/docs/extracting-components
purge(PurgeCSS) 应该应用于最终项目，包括来自外部库的组件。我在使用TailwindCSS库中的组件样式时遇到问题，因为最终的 AMD 和 ES2015 版本包含内联样式，无法通过主应用程序中的 Tailwind 配置进行处理。
当我在同一个主项目中本地使用 Angular 库时，它就非常有效（请参阅组件“本地演示”的示例）。但是，当我将库发布为 NPM 包时，类与实用程序一起内联到模块中@apply，无法正确处理。
发布的库组件代码示例（ES2015模块）：
styles: ["@layer components{.first-component-base {@apply w-full;} .first-component-base.first-component-disabled {@apply opacity-50;} .first-component-base .first-component-wrapper {@apply rounded-lg bg-skin-fill;} .first-component-base .first-component-wrapper .first-component-block {@apply max-w-7xl mx-auto py-3 px-3 sm:px-6 lg:px-8;} .first-component-text {@apply ml-3 font-medium text-white truncate;}}\n"]
如您所见，@apply如果您将组件库添加为 NPM 包，则构建的模块样式包含主应用程序的 Tailwind 配置无法处理的样式。
源代码示例和自述文件 - https://github.com/maxcoffer/angular-tailwind-library
这是我到目前为止所尝试过的，或者作为示例进行测试的，但它的工作效果并不完全完美或者有自己的缺点。
使用组件提取作为 TailwindCSS plugin（请参阅 …