Fumadocs UI v15发布：全面迁移至Tailwind CSS v4

Fumadocs是一个现代化的文档系统构建工具，它基于Next.js框架，提供了开箱即用的文档站点解决方案。作为其核心组件之一，Fumadocs UI负责处理文档站点的用户界面部分，包括样式、布局和交互组件等。

重大更新：Tailwind CSS v4迁移

Fumadocs UI v15版本最重要的变化是完成了对Tailwind CSS v4的全面迁移。Tailwind CSS作为目前最流行的实用优先CSS框架，其v4版本带来了诸多改进和新特性。

迁移指南

迁移到Tailwind CSS v4后，配置方式发生了显著变化。现在不再需要JavaScript配置文件，所有配置都可以直接在CSS文件中完成。以下是推荐的CSS文件配置：

@import 'tailwindcss';
@import 'fumadocs-ui/css/neutral.css';
@import 'fumadocs-ui/css/preset.css';
/* 如果启用了Twoslash功能 */
@import 'fumadocs-twoslash/twoslash.css';

@source '../node_modules/fumadocs-ui/dist/**/*.js';
/* 如果启用了OpenAPI功能 */
@source '../node_modules/fumadocs-openapi/dist/**/*.js';

关键说明

1. preset.css：这是必须导入的文件，它声明了Fumadocs UI所需的插件和基础样式。
2. neutral.css：定义了UI的默认配色方案。
3. @source指令：用于指定Tailwind CSS应该扫描哪些文件来提取类名。路径是相对于CSS文件本身的，需要根据项目实际结构调整。

其他改进

除了Tailwind CSS v4的迁移外，v15版本还包含以下改进：

1. 侧边栏重新设计：优化了侧边栏的视觉体验和交互方式。
2. Fumadocs核心兼容性：确保与Fumadocs v15版本的完全兼容。

技术影响

这次升级对开发者意味着：

1. 更简洁的配置：摆脱了复杂的JavaScript配置，所有样式定义现在都可以在CSS文件中完成。
2. 更好的性能：Tailwind CSS v4在构建速度和运行时性能上都有所提升。
3. 更现代的架构：采用了Tailwind CSS最新的设计理念和技术实现。

升级建议

对于现有项目，升级到v15版本需要：

1. 按照上述指南重构CSS配置
2. 检查自定义样式是否与新版本兼容
3. 测试所有UI组件以确保功能正常

Fumadocs UI v15的这次升级标志着项目向更现代化、更高效的开发体验迈进了一大步，特别是对于追求简洁配置和最佳性能的开发者来说，这是一个值得考虑的升级版本。