vue 项目，开发预览和构建后的页面不一致，求助

[LeeReamond]

如题，项目中使用 vue + vuetify + tailwind 。第一次使用 tailwind，没想到遇到这种问题。

具体表现为，使用 npm run serve 运行开发服务器，显示界面如同代码预期，一切正常。而使用 npm run build 编译项目后使用后端提供服务，则部分样式出现了错误。如同下图

补充

1 、整个项目完全由前端构建，全部为静态文件，不涉及任何后端 api

2 、图中可见，页面使用了两个 vuetify 组件，分别是 header 和两个按钮，这些组件都出现了变形。而使用 tailwind 构建的样式则完全没问题。

3 、经测试 vue 的 js 代码可以正常运行，输出结果正确

4 、我测试了一下编译后的 index.html 中加载的样式和脚本文件，全部都可以正常访问，不是由于某个文件无法加载造成的错误。

5 、图中可以看到，materialdesignicons 的图标是可以正常显示的，说明图标文件加载没问题

有没有大佬能说下可能是啥原因导致的？

[christin]

@LeeReamond 正好我也在学习 tailwind 18 楼是你的项目吗 我装起来看一下

[GzhiYi]

我认为是 tailwindcss 在 build 的过程之中把顶栏的样式 purge 掉了。
在 postcss 配置中的 whitelistPatternsChildren 增加白名单试试？

[changdy]

2333 前端现在黑箱比后端还严重....

有时候出问题了都不知道哪个步骤引入的

[leega0]

@changdy 莫要黑，很明显，楼主不是一个前端，这种问题，专业的前端看标题就知道是什么原因了

[changdy]

@leega0 2333 木有黑..现在好多传统公司 是真的已经请不起能把 webpack 各种配置搞得明白的前端了...

[echowuhao]

前端一直黑箱严重。

[doco]

我倾向于只使用一个样式库, 同时使用多个就容易出现这种问题

[shzx1994529]

@GzhiYi 是的，估计是被 purge 掉了，我就被坑过

[LeeReamond]

@shzx1994529 后面修改了 purge 后问题已经解决
@doco 不太现实，vue 前端组件框架我用过三个，描述能力和可定制性都不怎么样，尤其当设计本身稀烂的时候，你去 codepen 搜登录界面就能看到所有用 vuetify 做出来一个赛一个的土，就没有一个能拿得出手的。。所以你往往需要自己封装组件，然而往往又不能自己封装所有组件，所以两者都要

[ciddechan]

reset.css