必须保留 tailwind.config.js 并正确配置 css 入口：①单引号+分号写 @import 'tailwindcss'; ②@theme 紧接其后且变量带 --color-/--font-/--spacing- 前缀；③全局变量须在 @layer base 中 :root 定义。
直接删掉 tailwind.config.js 就能启用 CSS 变量驱动的样式系统，但前提是你的 CSS 入口文件里写对了三件事：@import 'tailwindcss';、@theme、变量命名和位置都合规——缺一不可，错一个就静默失效，连 text-lg 都不生成。
必须用单引号 + 分号写 @import 'tailwindcss';
Oxide 引擎只认这一种写法。双引号、没分号、拆成多个 @tailwind 指令，全部被跳过，且不报错。
-
@import "tailwindcss";❌（双引号） -
@import 'tailwindcss'❌（缺分号） -
@tailwind base; @tailwind components; @tailwind utilities;❌（v4 已废弃） -
@import 'tailwindcss';✅（唯一有效形式）
@theme 必须紧接 @import 后，且变量带标准前缀
@theme 块不是可选装饰，它是 Oxide 引擎提取颜色、字体、间距的唯一来源。它必须出现在同一 CSS 文件中、@import 'tailwindcss'; 之后，且变量名必须以 --color-、--font-、--spacing- 开头。
Pandas 配置文件报告生成器
下载
使用ydata-profiling（前身为pandas-profiling）生成全面的数据质量报告，包含相关性分析、缺失值模式和基数检测。导出交互式HTML仪表板和JSON摘要。
-
@theme { --primary: #3b82f6; }❌（缺少前缀，引擎忽略） -
@theme { --color-primary: #3b82f6; }✅（生成text-primary、bg-primary） -
@theme { --color-brand-500: oklch(65% 0.25 270); }✅（OKLCH 格式才能推导brand-400/brand-600） - 跨文件写
@theme❌（作用域隔离，只影响当前 CSS 文件）
全局变量必须集中写在主入口 CSS 的 @layer base 里
想让 bg-[var(--color-bg)] 这类任意值语法生效，CSS 变量本身得提前定义，且只能在 @layer base 中通过 :root 声明。写在 @layer utilities 或普通顶层 CSS 里，PostCSS 阶段根本扫不到。
-
@layer base { :root { --color-bg: #fff; } }✅（可被任意值语法引用） -
:root { --color-bg: #fff; }❌（不在@layer base内，会被忽略） -
@layer utilities { --color-bg: #fff; }❌（层级错误，不参与变量解析） - 拼写不一致如
bg-[var(--bg-color)]但定义是--color-bg→ ❌（静默不生效）
最容易被忽略的是：变量名统一性、@theme 和 @layer base 的物理位置、以及 @import 的标点细节——它们都不报错，但会直接导致整个工具类系统“哑火”。你看到页面没样式，大概率不是引擎没跑，而是它压根没读到任何有效配置。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
