Tailwindv3JIT提升构建速度技巧

Tailwind CSS v3 构建缓慢的根源往往并非 JIT 未启用，而是沿用了过时的 v2 配置（如错误保留 `mode: 'jit'`）、`content` 路径配置失当导致扫描失控、环境变量缺失（尤其是 `TAILWIND_MODE=watch` 和 `NODE_ENV=development` 未同时生效），或 `@apply` 与动态 class 写法超出 JIT 静态分析能力；真正提速的关键在于彻底清理旧配置、精准声明 `content` 数组、确保工具链正确接入 v3 原生引擎，并理解 JIT 的“快”本质是依赖精准、可预测的代码结构——一旦扫描失焦或信号错乱，它会无声降级为全量编译，而你却毫无察觉。

Tailwind CSS 构建慢，八成不是 JIT 没开，而是你还在用 v2 的配置方式或 content 扫描失控——v3+ 已默认启用 JIT，mode: 'jit' 这行必须删掉，否则反而会干扰原生引擎。

确认是否真在用 Tailwind v3+ 的 JIT

别信配置里有没有 mode: 'jit'，它在 v3 中已被移除。真正判断依据只有两个：

• npx tailwindcss -v 输出必须是 v3.x.x（如 v3.4.3）
• package.json 中 "tailwindcss" 版本号 ≥ 3.0.0，且不能同时存在 @tailwindcss/jit 包（有就立刻 npm rm @tailwindcss/jit）
• PostCSS 配置中插件必须是 tailwindcss，不是 @tailwindcss/jit —— 后者会绕过 v3 引擎，退化为全量编译

content 路径写错 = JIT 失明

JIT 不再识别 purge 字段，只认 content 数组。写错路径、类型或格式，JIT 就扫描不到 class 使用，结果就是：开发时样式不出现、热更新卡顿、甚至回退到全量生成。

• content 必须是数组，不能是字符串或对象
• 路径要覆盖所有 class 出现场所：./src/**/*.{js,jsx,ts,tsx,vue} + ./public/index.html（如果用 HTML 入口）
• Vue SFC 的