安装
npx ai-elements@latest适合谁
这份指南面向要在 shadcn/ui 之上更快搭建 AI 原生应用界面的前端开发者。官方把 AI Elements 写成建立在 shadcn/ui 上的组件库。
动手前必须同时满足：Node.js 18 or later；已有安装了 AI SDK 的 Next.js 项目；项目里已经初始化 shadcn/ui（页面写出 npx shadcn@latest init）。还要求 Tailwind CSS 已配置，并且 AI Elements 只支持 CSS Variables mode。缺一项都不要跑安装。
这是组件安装，不是某个 Agent 市场插件。不要把 npx ai-elements@latest 推广成未出现的编辑器插件。
3 分钟完成第一次尝试
只采用页面给出的推荐安装命令：
npx ai-elements@latest
前置条件：当前目录就是那个已初始化 shadcn/ui、且装有 AI SDK 的 Next.js 项目；Node.js 为 18+；Tailwind 处于 CSS Variables 模式。安装位置是你已配置的 components 目录，以及项目依赖。
副作用确认点：页面写明安装全部组件时会：若尚未配置则 Set up shadcn/ui；把所有 AI Elements 组件装进已配置的 components 目录；并把必要依赖加入项目。这会改文件和 package 依赖。若目录不对，或你只想先核对前提，先停下来。确认后再执行。
成功信号：命令正常结束，components 目录出现新组件、依赖已写入。第一次只做检查：打开其中一个新装入的组件文件，确认它落在你配置的目录中。不要马上把它接到未出现在摘录里的聊天页面或生产路由。若向导还要继续改更多文件，先停在确认点。
使用案例
案例一：在满足前提的项目里执行官方安装。确认 Node.js 18+、Next.js + AI SDK、npx shadcn@latest init 已完成、Tailwind 为 CSS Variables mode 后，运行 npx ai-elements@latest。证据覆盖的是这条推荐命令和前提列表。完成标准止于安装成功、组件进入已配置目录。不要补写未出现的单个组件名或 registry URL。
案例二：先看清“安装全部组件”会做什么，再决定是否继续。摘录写明它会在需要时设置 shadcn/ui、把全部 AI Elements 装进 components 目录，并添加必要依赖。第一次若你尚未准备好接收这些写入，就不要执行命令，只核对这三项副作用是否可接受。可观察的成功信号是：你能对照项目现状，确认 shadcn 已初始化、目标 components 目录存在。不要把“安装全部”理解成可以跳过 Tailwind CSS Variables 限制。
使用边界
主安装路径只有 npx ai-elements@latest。npx shadcn@latest init 是前提，不是第二套主安装器。必须 Node.js 18+、Next.js + AI SDK、已初始化的 shadcn/ui，且 Tailwind 仅支持 CSS Variables mode。安装会改组件目录和依赖。卸载与单个组件选型未写明，不能当成安全结论。