Nuxt.js: css missing when generate

[imhazige]

Version

v2.10.0

Reproduction link

https://github.com/imhazige/nuxt-issue

Steps to reproduce

• download the source code,
• npm install
• npm run static

go to url http://localhost:8080/mobile/

you will see the class worked fine in dev mode not work after generate static files.

it is very wired.

for following scss definition.
https://github.com/imhazige/nuxt-issue/blob/master/componentsM/Header.vue#L66

.cls1 {
color: #36c512;
}

.onthercls {
color: #d71e74;
}

.misscls {
color: #c2cb12;
}

.somecolor {
color: #981c1c;
}

.cls2 {
color: #d28e60;
}

the cls2,onthercls, are not included in the generated html file.

What is expected ?

all class should included in the generated file

What is actually happening?

with the same syntax, some one included, some one miss. very wired.

_{This bug report is available on Nuxt community (#c9875)}

[manniL]

As you are using tailwind + purgecss, it is likely purged by the plugin, as it doesn't look in the componentsM folder.

Please check https://www.purgecss.com/, https://github.com/Developmint/nuxt-purgecss and https://github.com/nuxt-community/nuxt-tailwindcss :relaxed:

[imhazige]

Hi, @manniL

It is using tailwind, but not set up purgecss. I think purgecss is set up by default, right?

[manniL]

TailwindCSS module for Nuxt.js with nuxt-purgecss + modern css zap
https://github.com/nuxt-community/nuxt-tailwindcss

Yes

[imhazige]

@manniL

You save our life, thank you so much.

after move componentM to components folder, all works like a charm.