用途:用于构建 Vue 界面并定制主题以匹配品牌,覆盖 Nuxt、Vue(Vite)、Laravel(Vite + Inertia)、AdonisJS(Vite + Inertia)等环境。
主要能力:提供 125+ 无障碍 Vue 组件;基于 Reka UI、Tailwind CSS 与 Tailwind Variants;支持语义化颜色与主题定制;可通过 ui prop / class prop、全局配置与主题默认值按优先级覆盖样式。
使用方式:安装 pnpm add @nuxt/ui tailwindcss。Nuxt 中在 nuxt.config.ts 注册 @nuxt/ui 模块并引入 CSS;Vue 中在 vite.config.ts 使用 ui() 插件并在入口 app.use(ui)。全局需用 UApp 包裹(toasts、tooltips、程序化浮层依赖),并可使用 locale prop 支持 i18n。组件 API(props、slots、events)可通过 Nuxt UI MCP 服务器查询,例如在 Claude Code 执行 claude mcp add --transport http nuxt-ui https://ui.nuxt.com/mcp,常用工具含 search-components、search-composables、search-icons、get-component、get-component-metadata、get-example。
限制与注意:图标使用 i-{collection}-{name} 格式,默认 lucide;应使用语义色(如 text-default、bg-elevated、border-muted),避免 text-gray-500 等原始调色板颜色;可读取生成的主题文件查看 slot 名称。资料未提供定价、性能与兼容性细节。