必须将@import 'tailwindcss';置于最前并加分号，其后紧接@theme块且变量须带--color-、--font-、--radius-等固定前缀，否则oxide引擎静默跳过导致工具类不生成。
必须用 @import 'tailwindcss'; + @theme 块，且变量名带固定前缀（如 --color-primary），否则工具类根本不会生成——不是报错，是静默失效。
为什么 @theme 必须紧跟 @import
v4 的 Oxide 引擎只在 @import 'tailwindcss'; 后扫描 @theme 块。顺序错、漏分号、引号用双引号，都会导致整个主题被跳过。
-
@import 'tailwindcss';必须写在最前面，末尾分号不能少 -
@theme块必须紧接其后，中间不能插其他@import或样式规则 - 如果用了
postcss-import，得删掉它，否则可能重复解析、覆盖主题
@theme 变量命名有硬性前缀要求
Oxide 引擎只识别特定前缀的 CSS 变量，拼错一个连字符或用错前缀，就等于没写。
- 颜色：必须以
--color-开头 →--color-primary: oklch(0.55 0.27 262);→ 生效bg-primary - 字体：必须以
--font-开头 →--font-sans: 'Inter', sans-serif;→ 生效font-sans - 圆角：必须以
--radius-开头 →--radius-card: 0.75rem;→ 生效rounded-card -
--primary、--my-color、--theme-primary全部无效
多主题切换要靠 [data-theme] 覆盖，不是 dark:
dark: 是 v4 对 prefers-color-scheme 的专用映射，和 data-theme="dark" 完全无关。混用会导致样式忽明忽暗。
- 所有主题变量必须定义在
@layer base中，否则会被 Tailwind 默认样式覆盖 - 主变量写在
:root，各主题用[data-theme="blue"]等选择器覆盖 -
data-theme必须设在上，设在或组件里会漏继承 - JS 切换只需一行：
document.documentElement.dataset.theme = 'blue'
构建时不会报错，但 class 不生成是最容易踩的坑
v4 不会提示“@theme 未识别”，而是直接跳过——你写的 bg-primary 在浏览器里查不到对应 CSS 规则，DevTools 里也看不到。
- 检查点优先级：先确认
@import和@theme顺序 & 语法；再看变量前缀；最后查是否漏了@layer base - VS Code 插件默认读
tailwind.config.js，v4 下需手动配置"tailwindCSS.experimental.configFile"指向你的主 CSS 文件 -
tailwind.config.js里的theme.extend.colors在 v4 中完全不生效，别往里写var(--color-primary)
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
