2

I struggled in setting this up, so I thought I would share my Knowledge.

Basically, I wanted to have a UI Kit / Component library with NX that could be shared with for example a webapp with react and a website built with Next.js.

I ran into this error:

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)

[...]This is because you are trying to put Tailwind’s base styles in a CSS module, and CSS modules can’t contain those types of rules. This is just how CSS modules work, you shouldn’t put Tailwind’s base styles in a module, the two concepts are just not compatible. [...]

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

Daniel Eberl
  • 1,268
  • 1
  • 10
  • 22

1 Answers1

-1

This branch contains the basic setup: https://github.com/DanielSoCra/test-nx/tree/tailwind-shared-lib

Basically, I had NOT to import the css inside the lib, but in the apps/website and apps/webapp respecitvely. For the rest of the configs with postcss and tailwind refer to the repository.

Daniel Eberl
  • 1,268
  • 1
  • 10
  • 22