question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Whitelisting no longer works in Tailwind Options

See original GitHub issue

What worked in prior builds of Nuxt and TailwindCSS in the purgeCSS key in nuxt.config.js:

      whitelist: ['tip', 'warning', 'expert'],
      whitelistPatternsChildren: [/content.$/]

No longer works in the updated built-in options key for Tailwind:

  purge: {
    options: {
      whitelist: ['tip', 'warning', 'expert'],
      whitelistPatternsChildren: [/content.$/]
   }
}

The only thing that does work is to set enabled: false (contrary to this issue)–but then CSS is not purged.

Issue Analytics

  • State:closed
  • Created 3 years ago
  • Reactions:15
  • Comments:22 (2 by maintainers)

github_iconTop GitHub Comments

8reactions
kswedbergcommented, Oct 14, 2020

Not sure if this is the source of the problem, but I just noticed that PurgeCSS changed their blacklist and whitelist options to safelist and blocklist.

https://purgecss.com/configuration.html

7reactions
c3s4rcommented, Jan 4, 2021

I just confimed t works if you use options and safelist:

purge: {
  options: {
    safelist: ["whitelisted"],
  },
  // ...
}
Read more comments on GitHub >

github_iconTop Results From Across the Web

Whitelisting no longer works in Tailwind Options #124 - GitHub
I had to move them to my layout file. Oddly enough, if I had a placeholder style in my layout, THEN the style...
Read more >
TailwindCSS / PurgeCSS whitelist not working - Stack Overflow
Tried various solutions I found, but nothing seem to do the trick, it keeps purging the classes I add to the whitelist. Any...
Read more >
Content Configuration - Tailwind CSS
The blocklist option only affects CSS that would be generated by Tailwind, not custom CSS you've authored yourself or are importing from another...
Read more >
Sage 10: Whitelist Tailwindcss classes on Purge
How is best to setup Sage 10 to whitelist Tailwind classes on Purge, I have tried adding the following to tailwind.config.js, but it...
Read more >
gatsby-plugin-purgecss
Define options in gatsby-config.js , not purgecss.config.js . If using tailwindcss, use the tailwind: true option. Use printRejected ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found