想让 AI 助手代劳？ 在你的编辑器中安装 HeroUI MCP Server，然后把上面的提示词粘贴给 AI 助手——它会分析你的项目并自动完成全部配置。

安装 HeroUI 及其所需依赖：

npm i @heroui/styles @heroui/react

pnpm add @heroui/styles @heroui/react

yarn add @heroui/styles @heroui/react

bun add @heroui/styles @heroui/react

导入样式

将以下内容添加到你的主 CSS 文件 globals.css：

@import "tailwindcss";
@import "@heroui/styles";

导入顺序很重要。请务必先导入 tailwindcss。

使用组件

import { Button } from '@heroui/react';

function App() {
  return (
    <Button>
      My Button
    </Button>
  );
}