Nx 工作区 - 与 tailwindcss 共享库并做出反应答案

【问题标题】：Nx workspace - Shared lib with tailwindcss and reactNx 工作区 - 与 tailwindcss 共享库并做出反应
【发布时间】：2022-01-25 12:14:32
【问题描述】：

我在设置过程中遇到了困难，所以我想我会分享我的知识。

基本上，我想要一个带有 NX 的 UI 工具包/组件库，可以与例如带有 react 的 webapp 和使用 Next.js 构建的网站共享。

我遇到了这个错误：

Failed to compile
../../libs/shared-ui/src/lib/shared-ui.module.css
CssSyntaxError

([object Object]:[object Object]) Selector "*,
::before,
::after" is not pure (pure selectors must contain at least one local class or id)

[...]这是因为您试图将 Tailwind 的基本样式放在 CSS 模块中，而 CSS 模块不能包含这些类型的规则。这就是 CSS 模块的工作原理，你不应该将 Tailwind 的基本样式放在一个模块中，这两个概念是不兼容的。 [...]

https://github.com/tailwindlabs/tailwindcss/issues/6717#issuecomment-1000805774

【问题讨论】：

标签： reactjs tailwind-css monorepo nomachine-nx

【解决方案1】：

此分支包含基本设置： https://github.com/DanielSoCra/test-nx/tree/tailwind-shared-lib

基本上，我不必在 lib 中导入 css，而是在应用程序/网站和应用程序/webapp 中分别导入。对于 postcss 和 tailwind 的其余配置，请参阅存储库。

【讨论】：