Tailwind插件未生效的主因是未在tailwind.config.js的plugins数组中手动注册，且自定义插件必须用tailwindcss/plugin封装并显式调用addUtilities等API，否则类名不会进入构建流程。
tailwind.config.js 里没注册插件，或者插件函数没用 tailwindcss/plugin 包装 —— 类名根本不会进构建流程。
插件没加进 plugins 数组
Tailwind 不会自动发现 node_modules 里的插件，必须手动引入并放进配置的 plugins 字段。
- 只运行了
npm install -D @tailwindcss/typography，但tailwind.config.js里没写require('@tailwindcss/typography') - 用了
import语法，但项目没设"type": "module"，导致require报错或静默失败 - 本地插件路径写错，比如
require('./plugins/my-plugin')，但文件实际在./src/plugins/
自定义插件没用 tailwindcss/plugin 封装
直接导出对象或函数，Tailwind 完全不识别。
- 错误写法：
module.exports = { '.my-utility': { display: 'flex' } }—— 这个对象会被忽略 - 正确写法：必须用
const plugin = require('tailwindcss/plugin')，再plugin(function({ addUtilities }) { ... }) -
theme()只能在插件函数内部调用，外部写theme: { extend: { ... } }是无效的
插件里没调用 addUtilities 或 addComponents
即使插件被加载了，如果没显式注册样式，类名还是不会生成。
- 写了
plugin(() => {})，但函数体为空，或只写了console.log - 想加响应式类，但忘了传
variants参数：addUtilities(..., { variants: ['hover', 'group-hover'] }) - 用
addComponents加组件类时，没加@layer components前缀，导致优先级或 Purge 行为异常
PostCSS 插件没启用，@tailwind 指令被当注释
tailwind.config.js 配对正确，插件也注册了，但最终 CSS 文件里全是 @tailwind base; 这种原样文本。
- Vite 用户：检查
postcss.config.js是否含require('@tailwindcss/postcss')（不是旧版tailwindcss） - CRA 用户：默认禁用 PostCSS 自定义，得用
craco注入，或eject - Webpack 用户：确认
css-loader的modules选项是false；开启后类名被哈希化，和插件生成的原始类名对不上
插件逻辑本身没问题，但漏掉任意一环 —— 从注册、封装、调用到 PostCSS 链路 —— 类名就彻底消失。调试时先查构建产物里有没有对应 CSS 规则，再逆向验证每层是否真正生效。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
