Why is the nuxt-content style not working?

[anakais]

The ordered list and the code block isn't styled in production.
I thought it was just mine but yours too:
https://ntn-boilerplate.netlify.app/blog/2021-03-01-how-to-edit-the-content

It works fine on when i'm working on npm run dev but when when i generate the pages this occurs.

[anakais]

Hey, i just found out why: Was the purgeCSS.

I had to ignore a block like this and the style appeared:

/*! purgecss start ignore */
    & > ol {
      @apply list-decimal grid gap-y-2 my-4 ml-4;
      & ol {
        @apply list-decimal grid gap-y-1 ml-8 mt-2;
      }
    }
    & code,
    & kbd,
    & samp {
      color: var(--text-secondary);
      background-color: var(--bg-secondary);
      @apply p-1 rounded transition-colors duration-200 ease-in-out;
    }
/*! purgecss end ignore */

I believe there are other selectors that are being purged. I don't know much about PurgeCSS or PostCSS so I'll leave it here until I find a more general solution (or someone more knowledgeable).

[Knogobert]

Good catch! I definitely struggle too with purgeCSS with this boilerplate. The big reason why is that the built content isn’t given to purgeCSS as "used markup". So it doesn’t know to include it unfortunately.

I'll see what I can do to fix this, but in the meantime, using purgecss ignore is sufficient.
Thanks!

[Knogobert]

This is now fixed and added to version 2.1.1