Tailwindcss-module: 2.0.0 not purging css?

[alexanderjanke]

Version

@nuxtjs/tailwindcss: 2.0.0
nuxt: 2.12.2

Reproduction Link

https://github.com/alexanderjanke/nuxt-ts-tailwind-template/pull/21

Steps to reproduce

• npm run build && npm start
• open website
• ctrl + u

What is Expected?

CSS should be purged

What is actually happening?

CSS didn't get purged, everything is imported instead.

I hope I didn't screw up some of the settings... ?

[zipme]

@alexanderjanke https://github.com/nuxt-community/tailwindcss-module/releases/tag/v2.0.0

[alexanderjanke]

Thanks, I double checked the tailwind.config.js and compared it with mine.

My current config looks like this

module.exports = {
  theme: {
    darkSelector: ".dark-mode"
  },
  variants: {
    backgroundColor: ['dark', 'dark-hover', 'dark-group-hover', 'dark-even', 'dark-odd'],
    borderColor: ['dark', 'dark-focus', 'dark-focus-within'],
    textColor: ['dark', 'dark-hover', 'dark-active']
  },
  plugins: [require("tailwindcss-dark-mode")()],
  purge: {
    enabled: process.env.NODE_ENV === 'production',
    content: [
      "layouts/**/*.vue",
      "pages/**/*.vue",
      "components/**/*.vue",
      'nuxt.config.ts'
    ],
    options: {
      whitelist: ["dark-mode"]
    },
  },
}

Once i npm run build && npm start, the page is still huge and has loaded all of the possible css there is. A rm -rf .nuxt node_modules && npm i lead to no success as well :/

Am i really that dense and miss something super obvious here? 😭

[Atinux]

Hi @alexanderjanke

I just tried and it works:

Note that I am using Yarn and also NPM

[alexanderjanke]

I'm giving it a shot on a completely blank project tomorrow or so. Maybe something funky happened during my update and it's just my personal luck 😄

Edit: I just noticed that you tried my repo. Hmmm, that's interesting that it works for you @Atinux! Any ideas on why it wouldn't work on my end?

[leonvor]

Have you tried deleting your package-lock.json along with the node_modules folder? Worked for me.

[alexanderjanke]

Yup! Just tried it on a different machine with npm -> didn't work. Tried with yarn -> worked. Gonna try it tomorrow with my work-pc (that's where I originally noticed the issue).

[Atinux]

It’s possible that it only works with Yarn, I tried with NPM after installing with Yarn

[alexanderjanke]

Okay to summarize:

Did a rm -rf .nuxt node_modules package-lock.json
Then npm i && npm run build && npm start
Now it works with npm too! I Just did the same thing yesterday and now it suddenly works 😄

Then I did another
rm -rf .nuxt node_modules package-lock.json
followed by
yarn install && yarn build && yarn start
Works as well.

No idea on why it failed the first 100 times I tried it before opening this issue but now it does. Maybe it's some super rare edge-case that I cannot pinpoint. Anyways, thanks for the responses and feel free to close this issue :)

[Atinux]

That’s why I use Yarn and not NPM 👀😁