Tailwind生产环境样式消失八成因content路径未覆盖实际用class的文件，v3+仅按content中glob路径扫描源码字符串，不解析import、变量或运行时拼接，漏配tsx/vue/HTML模板、第三方库文件或动态class未进safelist均会导致样式丢失。
tailwind.config.js 的 content 路径没覆盖实际用 class 的文件
生产环境样式“消失”，八成是 content 数组漏掉了某些真实存放类名的文件。Tailwind v3+ 不再读 purge 字段，只严格按 content 里写的 glob 路径去扫描源码字符串——它不会递归解析 import、不理解 JS 变量含义、更看不到运行时拼接的字符串。
- 常见遗漏：
"./src/**/*.{js,ts}"写了，但组件是.tsx或.vue，就得显式加上tsx和vue - 静态 HTML 模板（如
public/index.html）没加进content，里面写的class="bg-blue-500"就会被 PurgeCSS 当作“死代码”删掉 - Flowbite、DaisyUI 等第三方组件库的 Svelte/Vue/React 文件若在
node_modules里，也得手动列进content，否则它们内部用的 class 一样被清空 - 使用
import.meta.glob或require.context动态加载的模块，其路径不会被 glob 自动捕获，必须单独写进content
glob 模式写错或匹配不到真实文件结构
写了路径不等于能扫到——content 里的 glob 是给 Node.js 的 fast-glob 用的，大小写、斜杠方向、扩展名拼写都必须和磁盘上完全一致。比如项目里全是 .jsx，你却写了 .js，那所有 JSX 文件就全漏了。
- Windows 下路径分隔符用
/或\都行，但统一用/更稳妥 -
**是递归匹配，*只匹配单层；./src/*.{js,ts}不会扫到src/utils/helper.ts，得写成./src/**/*.{js,ts} - 路径含空格时，每个
--content值必须单独用双引号包裹，不能合并：✅--content "./pages/**/*.{js,ts}" --content "./components/**/*.{js,ts}"，❌--content "./pages/**/*.{js,ts} ./components/**/*.{js,ts}"
动态 class（如 bg-${color}-500）没进 safelist
PurgeCSS 匹配的是源码里的字符串，不是最终渲染的 DOM。JS 中拼接出来的 class 名，比如 className={`text-${theme}-500`}，根本不会出现在任何文件的原始文本里，自然不会被扫描到。
Json Schema Toolkit
下载
使用 JSON Schema 验证 JSON 数据，从示例 JSON 生成 schema，并将其转换为 TypeScript 接口、Python 数据类或 Markdown 文档。
- 简单场景可硬编码：
safelist: ['bg-red-500', 'text-blue-600'] - 多变体推荐正则：
{ pattern: /text-(red|blue|green)-(500|600)/ }，注意响应式前缀要显式包含，如/^(md|lg):text-(red|blue)-500$/ - 避免
.*结尾：比如/text-.*/会意外匹配text-clip这类原生属性，导致冗余样式 - 函数式 safelist 更可控：
safelist: [{ pattern: /bg-(blue|green|red)-(100|500)/ }]
构建命令没传 --content，或残留 TAILWIND_MODE 环境变量
很多项目用自定义脚本调用 tailwindcss CLI，但忘了显式传 --content。v3+ 不再自动推导路径，缺了就只扫默认的 ./src/**/*.{html,js,ts,jsx,tsx}，跟你实际目录对不上。
立即学习“前端免费学习笔记（深入）”；
- 检查
package.json里的build脚本：❌npx tailwindcss -i ./src/input.css -o ./dist/output.css --minify，✅ 补上--content参数 - CI/CD 或本地 .env 里残留
TAILWIND_MODE=build？这个变量在 v3.3+ 已弃用，还可能干扰 JIT 对动态 class 的识别，直接删掉 - 确认
tailwind.config.js里没有mode: 'jit'—— v3.3+ 不支持，留着会报错 - 临时验证：注释掉
content字段，跑一次 build；如果样式全回来了，问题就锁定在 PurgeCSS 扫描逻辑
class="text-red-500"，只要源码里没这串字，它照样被删。 
