Can't find CSS elements after using purgecss

[pascalandy]

Hi,

I followed all 8 videos of '01-getting-up-and-running'.

In the 8th video, I ran the example to 'purgecss' and I can see the css is much smaller like 2kb. All good.

Issue

Now if I modify anything in my index.html the build cannot find CSS elements anymore. Here is my repo .

Error

➜  01-getting-up-and-running git:(edge) ✗ npm run build

> tw-demo@0.1.0 build /Users/andy_lap/Documents/github/pascalandy/tw-demo/01-getting-up-and-running
> postcss css/tailwind.css -o public/build/tailwind.css

CssSyntaxError: /Users/andy_lap/Documents/github/pascalandy/tw-demo/01-getting-up-and-running/css/tailwind.css:4:5: `@apply` cannot be used with `.px-5` because `.px-5` either cannot be found, or its actual definition includes a pseudo-selector like :hover, :active, etc. If you're sure that `.px-5` exists, make sure that any `@import` statements are being properly processed *before* Tailwind CSS sees your CSS, as `@apply` can only be used for classes in the same CSS tree.

  2 | @tailwind components;
  3 | .btn {
> 4 |     @apply px-5 py-7 inline-block rounded-lg shadow-lg bg-indigo-500 text-sm text-white uppercase tracking-wider font-semibold;
    |     ^
  5 | }

Thank you!