即时编译：Tailwind CSS的下一代
内容提要
Tailwind CSS v2.1引入了即时编译器，取消了@tailwindcss/jit包。新编译器按需生成CSS，缩短构建时间，支持所有变体，简化配置，确保开发和生产环境CSS一致，提升浏览器性能。未来将整合进Tailwind CSS v3.0。
延伸解读
从独立包到核心集成
即时编译器最初以 @tailwindcss/jit 实验库形式发布，需要单独安装并配置到 PostCSS 中。但文章更新指出，从 Tailwind CSS v2.1 开始，该引擎已直接内置，不再需要额外安装。这意味着开发者可以更无缝地体验按需生成 CSS 的优势，也反映出官方对这项技术的信心。未来它将成为 v3.0 的默认行为，进一步简化工具链。
开发与生产环境的一致性
传统 Tailwind 工作流中，开发环境会生成庞大的 CSS 文件，而生产环境依赖 purge 移除未使用样式，这可能导致意外删除重要样式。即时编译器按需生成样式，开发和生产构建大小相同，无需 purge，从而保证两个环境下的 CSS 完全一致。这减少了因环境差异引发的样式问题，也让调试更可靠。
构建性能的显著提升
文章提到，使用 CLI 初次编译 Tailwind 可能需要 3–8 秒，在 webpack 项目中甚至达到 30–45 秒，因为 webpack 处理大 CSS 文件效率较低。即时编译器能在约 800 毫秒内完成最大项目的编译，增量重建快至 3 毫秒。这种速度提升不依赖于特定构建工具，对大型项目尤其有益。
变体与任意值的自由使用
以往为了控制文件大小，focus-visible、active、disabled 等变体默认不启用，需要手动配置。即时编译器按需生成样式，因此所有变体开箱即用，甚至可以堆叠如 sm:hover:active:disabled:opacity-75。此外，通过方括号语法可以生成任意值，例如 top-[-113px]，无需编写自定义 CSS。这为设计系统外的特殊需求提供了便利。
Q&A
Tailwind CSS v2.1引入了什么新功能？
Tailwind CSS v2.1引入了即时编译器，取消了@tailwindcss/jit包。
即时编译器如何影响构建时间？
新编译器按需生成CSS，显著缩短了构建时间，能够在约800毫秒内编译大型项目。
使用即时编译器有什么优势？
即时编译器支持所有变体，简化配置，确保开发和生产环境CSS一致，提升浏览器性能。
Tailwind CSS v3.0将会有什么变化？
Tailwind CSS v3.0将整合即时编译器，并计划将其作为默认选项。
即时编译器如何处理CSS变体？
即时编译器允许用户随时使用任何变体，且不需要额外配置。
开发环境和生产环境的CSS有什么不同？
使用即时编译器后，开发和生产环境的CSS完全一致，无需清除未使用的样式。
