Tailwindcss-module: Safelist option doesn't work ?

Created on 19 Mar 2021  ·  8Comments  ·  Source: nuxt-community/tailwindcss-module

Version

@nuxtjs/tailwindcss: ^4.0.1
nuxt: 2.15.3

Reproduction Link

https://codesandbox.io/s/elegant-tu-xipm4

Steps to reproduce

  • Add classes on purge: { options: { safelist: [] } } doesn't work

What is Expected?

  • I would like to force tailwind to keep safelist classes

What is actually happening?

  • Safelist doesn't worked
bug

All 8 comments

Could you provide a reproduction please?

@Atinux you didn't have access to the codesandbox reproduction link ?
=> https://codesandbox.io/s/elegant-tu-xipm4

You're using JIT which doesn't support it yet
https://github.com/tailwindlabs/tailwindcss-jit#known-limitations

Thx @web2033 but purge: { content: [] } it works?

I think with JIT it works in reverse. It's not purging now but creating classes on the fly.

Ok, to solved the problem I have created a fake component with all the classes I want to safe which I called on the content array and its worked but it's not pretty

@web2033 "Advanced PurgeCSS options like safelist aren't supported yet since we aren't actually using PurgeCSS. We'll add a way to safelist classes for sure though. For now, a safelist.txt file somewhere in your project with all the classes you want to safelist will work fine."

it works?

Create a safelist.txt which contains all your classes you want to safe:

// Safelist.txt
md:w-1/2
md:w-6/12
...

Call the file on the content section of the purge

purge: {
    content: [
      './safelist.txt',
    ],
  },
Was this page helpful?
0 / 5 - 0 ratings