tailwind生产环境样式丢失主因是content路径未覆盖真实类名文件：v3+仅扫描content显式列出的源码文本，漏.tsx/.vue/html模板、第三方库路径、glob写法错误、动态类未进safelist或cli构建漏传--content参数均会导致样式被误删。
purge配置错误导致线上样式突然消失
不是报错，而是页面看起来“少了一块”：按钮没内边距、文字没颜色、卡片没圆角——DOM里class属性明明写着bg-blue-500和p-4，但开发者工具的Styles面板里查不到对应CSS规则。这是因为Tailwind在构建时压根没扫描到这些类名，直接从最终CSS中剔除了。
-
content路径漏掉.svelte或.vue后缀，SvelteKit/Nuxt组件里的类全丢 - 写
./src/**/*.{js,ts}却忘了jsx/tsx，React组件类名集体失踪 - 用
public/index.html写入口模板，但content没包含public/**/*.html - Laravel Blade模态框单独放在
resources/views/modals/create.blade.php，路径没覆盖到，上线后弹窗无样式
动态类名被静默删除，且毫无提示
Tailwind不执行JS，只匹配源码中字面量出现的完整字符串。像className={`text-${color}-600`}这种写法，除非color是固定字符串（如'red'）且该字符串真实出现在被扫描的文件里，否则text-red-600不会进CSS。更麻烦的是它不会警告你——构建成功，本地正常，上线就崩。
- 响应式前缀如
md:text-red-500必须显式出现在源码中，不能只写text-red-500 - 第三方UI库（如
react-datepicker）注入的类不在你源码里，需手动加进safelist - JSON配置项里存的类名（如CMS后台字段
"classNames": "p-2 bg-gray-100"），静态扫描无法触及，必须safelist兜底
打包体积异常膨胀，远超预期
content路径配错或缺失，JIT引擎根本没启动，结果输出接近全量CSS（常>2MB），而不是你实际用到的几十KB。这不是“优化不足”，而是“压根没裁剪”。
- 误用
./src/**/*带点斜杠前缀，在Vite/Next.js中可能被跳过，扫描失效 - 只写
app/**/*却漏了pages/**/*，dark:、group-等上下文类大量残留 - MDX或EJS模板生成HTML，但
content没加src/content/**/*.mdx或views/**/*.html.ejs
旧版purge配置残留引发静默失效
如果你还在tailwind.config.js里留着purge字段（比如purge: ['./src/**/*']或purge: { enabled: false }），v3+会直接忽略它——既不报错，也不fallback。你以为关了tree-shaking，其实裁剪照常运行，只是路径错了而已。
- 删掉所有含
purge的行，只保留content数组 - 确认构建命令走的是生产模式：
vite build或next build，而非vite dev - 验证是否真生效：临时注释掉
content字段跑一次build，如果样式全回来了，就是它的问题
content路径是否精确、safelist是否覆盖变体、有没有残留的purge字段。前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
