search

nuxt-modules / tailwindcss

Tailwind CSS module for Nuxt
https://tailwindcss.nuxtjs.org
MIT License
1.69k stars 183 forks source link

dynamic classes with template string gets purged #259

Closed fabianwohlfart closed 3 years ago

fabianwohlfart commented 3 years ago

Version

@nuxtjs/tailwindcss: 3.4.2 nuxt: 2.1412

Reproduction Link

https://github.com/fabianwohlfart/test__tailwind-nuxt-template-string

Steps to reproduce

install run generate run start -> ./pages/index.vue

What is Expected?

»test« is indented

What is actually happening?

»test« is not indented, due to the lack of the »ml« classes

i guess its purgecss not tailwind who is responsible for this? is there a workaround? we have nested data, and i really would like to use a template string, or should i do it somehow else?

atinux commented 3 years ago

I suggest you to directly add all the classes you know are dynamic inside the whitelist option:

purge: {
  options: {
    safelist: ['ml-1', 'ml-2', 'ml-3', 'ml-4', 'ml-5'],
  },
}
fabianwohlfart commented 3 years ago

thanks for the quick reply. ok, seems like we only have a manual solution here. thanks!

joshistoast commented 1 year ago

Any chance a future update will address this?

eladcandroid commented 1 year ago

@Atinux Is it considered as a bug?

atinux commented 1 year ago

I don't think no