tailwind css v4 的配置必须写在 .css 文件中，因 oxide 引擎仅解析 css 里的 @theme、@utility 等标准 at-rule，跳过 tailwind.config.js；变量需带 -- 前缀并在 @theme 块内声明，且 @import "tailwindcss" 必须前置；vscode 插件需手动配置 config file 路径。
因为 Tailwind CSS v4 的核心配置不再由 JavaScript 解析，而是由 Oxide 引擎直接扫描 CSS 源码中的 @theme、@utility 等指令——这些指令本身就是标准 CSS at-rule，必须写在 .css 文件里才能被识别和编译。
为什么 tailwind.config.js 不能继续用
Oxide 引擎（Rust 编写的全新编译器）在构建阶段完全跳过 JS 配置文件，不执行、不解析、不报错。它只读取 @import "tailwindcss" 后的 CSS 文件，并从中提取 @theme 变量、@utility 规则等。哪怕你保留 tailwind.config.js 并写了 theme.extend.colors.primary，只要没在 CSS 里声明 @theme { --color-primary: #3b82f6; }，bg-primary 就不会生成。
使用ydata-profiling（前身为pandas-profiling）生成全面的数据质量报告，包含相关性分析、缺失值模式和基数检测。导出交互式HTML仪表板和JSON摘要。
@theme 必须写在 .css 文件里的硬性约束
-
@theme是一个 CSS at-rule，语法上必须出现在合法的 CSS 上下文中；JS 文件里写它会被当作无效注释或语法错误 - 变量名必须带前缀（如
--color-、--breakpoint-），且只能在@theme块内声明，CSS 解析器才能将其映射为工具类 - 多个
.css文件中的@theme会自动合并，但跨文件引用需靠 CSS 变量链（如@theme inline），JS 配置无法参与这个链路 -
@import "tailwindcss"必须在同一文件中出现在@theme之前，顺序错就等于没写
后缀改 .css 不是“换名字”，而是配置语义的归位
以前把颜色、断点写在 JS 里，本质是用 JS 模拟 CSS 主题能力；v4 把这件事交还给 CSS 本身：
- --breakpoint-sm: 480px → 自动支持 sm:flex
- --color-primary: oklch(0.62 0.15 274) → 自动生成 text-primary、bg-primary 等类
- @utility sr-only { @apply absolute w-1 h-1 p-0; } → 直接产出 sr-only 类，无运行时开销
这些能力都依赖 CSS 原生语法，不是 JS 能“模拟”出来的。
最容易被忽略的是：VSCode 插件默认仍找 tailwind.config.js，删掉它后必须手动设置 "tailwindCSS.experimental.configFile" 指向你的主 CSS 文件，否则智能提示会失效——这不是插件坏了，是路径没对上。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
