search

vuetifyjs / vuetify

🐉 Vue Component Framework
https://vuetifyjs.com
MIT License
39.9k stars 6.97k forks source link

[Bug Report][3.0.0-alpha.10] v-row justify doesn't generate css in production build #14087

Closed lukeromanowicz closed 3 years ago

lukeromanowicz commented 3 years ago

Environment

Vuetify Version: 3.0.0-alpha.10 Vue Version: 3.2.6 Browsers: Chrome 92.0.4515.107 OS: Linux x86_64

Steps to reproduce

  1. use tailwind and vuetify in the same project.
  2. tailwind's purge css will not detect justify-center being used anywhere in the code because v-row expects it to be passed through a prop.
  3. purge css is disabled in dev mode so justify-center will be present, but it will be removed from production build.

Expected Behavior

dev and production builds work the same

Actual Behavior

dev and production build differs

Reproduction Link

http://cant.reproduce.in.codepen

Other comments

I bet a similar issue exists for all of the tailwind decorators injected to view templates only through props.

workaround: use justify-content class on v-row rather than justify="center" prop

KaelWD commented 3 years ago

PurgeCss will probably remove a lot of classes that are dynamically added, not just the grid system. Use windicss or set a whitelist for PurgeCss.

https://github.com/vuetifyjs/vuetify/issues?q=is%3Aissue+purgecss+is%3Aclosed