插件不生效主因是未注册到tailwind.config.js的plugins数组或导出结构不符规范；必须显式require()插件、用tailwindcss/plugin封装、在函数体内解构使用addUtilities/theme/e，含特殊字符类名须e()转义。
插件写完不生效，基本不是代码逻辑问题，而是加载链断在了最前面——tailwind.config.js 的 plugins 数组没注册，或插件导出结构不符合 tailwindcss/plugin 规范。
插件必须显式注册进 plugins 数组
装了 @tailwindcss/forms 或本地插件，不代表 Tailwind 会自动加载。它只认 plugins 数组里明确 require() 进来的模块。
-
require('@tailwindcss/forms')必须作为独立数组项写入，不能合并成require('@tailwindcss/forms,@tailwindcss/typography') - 本地插件路径要带
.js后缀：require('./plugins/my-plugin.js')，漏掉就构建失败 - 如果插件导出的是对象或字符串（比如直接
module.exports = { '.btn': { ... } }），Tailwind 完全静默忽略，不会报错也不会生成类
自定义插件必须用 tailwindcss/plugin 包一层
裸对象、顶层调用 addUtilities、提前调用 theme() 都无效。只有 plugin() 创建的函数上下文，才能安全使用 addUtilities、theme、e 等参数。
- 正确结构：解构
{ addUtilities, theme, e }，所有逻辑写在函数体内 -
theme('colors.blue.500')只能在函数体内调用；外部提前取值会报theme is not a function - 不要在
module.exports外层写任何样式逻辑，那部分代码根本不会执行
含斜杠、冒号的类名必须用 e() 转义
像 .aspect-16/9 或 .md:hover 这类名字，CSS 解析器会把 / 当除法、: 当伪类分隔符，导致样式失效或语法错误。
- 必须解构
e并显式调用：[`.aspect-${e('16/9')}`]、[`.md\:${e('hover')}`] - 漏掉
e()，生成的类名可能浏览器无法识别，或被 PostCSS 误解析 - 转义后还要注意 CSS 选择器优先级——
.md\:hover实际对应的是@media (min-width: 768px) .md:hover，得确保媒体查询和伪类嵌套写法匹配
最容易被忽略的是插件顺序：Tailwind 按 plugins 数组顺序执行，后面插件能覆盖前面同名类，但如果你依赖前一个插件注入的 theme 扩展，却把它放在后面，theme() 就取不到值。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
