tailwind css v4因采用rust编写的oxide引擎，仅识别@import 'tailwindcss'作为入口指令，@tailwind指令、postcss.config.js和tailwind.config.js均被绕过；旧写法被静默忽略而不报错，导致基础工具类不生成。
因为 Tailwind CSS v4 不再走 PostCSS 插件链，而是用 Rust 写的 Oxide 引擎直接解析 CSS 文件 —— @import 'tailwindcss' 是它唯一认的入口，@tailwind 指令、postcss.config.js、甚至 tailwind.config.js 都被绕过了。
为什么 @tailwind base 在 v4 里不报错却没样式？
Oxide 引擎根本不会识别 @tailwind 这类指令，它只响应 @import 'tailwindcss'。旧写法会被 CSS 解析器当作普通注释或无效规则跳过，既不报错也不生成任何 CSS。
- 常见现象：构建成功、浏览器无报错，但
text-gray-500、flex等基础类全失效 - 关键点：
@import 'tailwindcss'必须出现在 CSS 文件最顶部，不能套在@layer或@media里 - 如果用了
@layer base手动覆盖，v4 的@theme规则会优先级更高，旧覆盖逻辑可能被静默忽略
为什么 postcss.config.js 被完全忽略？
v4 的构建流程由 tailwindcss() 插件（如 @tailwindcss/vite）接管，从 content 扫描、类名提取到 CSS 输出全部在 Oxide 内完成，PostCSS 配置文件压根不加载。
- 即使你保留
postcss.config.js并配了autoprefixer，也不会生效 —— v4 已内置前缀补全，且按browserslist自动处理 - 更危险的是：同时启用
postcss()和tailwindcss()插件，会导致 CSS 被重复处理，出现 hover 变体丢失、伪类不触发等问题 -
tailwindcss()插件必须放在 Vite 插件数组靠前位置，否则其他 CSS 处理插件（如less()）可能提前编译，让 Oxide 失去 JIT 编译机会
v4 的 @import 'tailwindcss' 到底做了什么？
这不是传统 CSS 导入，而是 Oxide 的启动开关：它自动加载 base / components / utilities 三层，并激活 JIT 编译、@theme 解析、@plugin 注册等全部能力。
-
@import 'tailwindcss' important相当于 v3 的important: true -
@theme块里的--color-primary会自动生成text-primary，但变量名必须带前缀（--color-、--font-），否则引擎不识别 - 不再需要
content字段 —— Oxide 默认扫描src/**/*.{js,ts,jsx,tsx,vue}，路径扩展用@source指令即可
最容易被忽略的不是“删配置”，而是 @import 的位置、插件顺序、以及 CSS 变量命名规范 —— 这三处出错，样式就静默消失，连控制台都不会提醒你。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
