Astro

安装 React

HeroUI 构建于 React 之上，所以你需要首先安装 React。你可以遵循官方的集成指南来安装 React。

安装 HeroUI

在你的 Astro 项目中，运行以下命令之一来安装 HeroUI

提升依赖设置

注意：此步骤仅适用于使用 pnpm 安装的用户。如果你使用其他包管理器安装 HeroUI，你可以跳过此步骤。

如果你正在使用 pnpm，你需要将以下行添加到你的 .npmrc 文件中，以将我们的包提升到根目录 node_modules。

修改 .npmrc 文件后，你需要再次运行 pnpm install 以确保依赖项已正确安装。

Tailwind CSS 设置

HeroUI 构建于 Tailwind CSS 之上，所以你需要首先安装 Tailwind CSS。你可以遵循官方的安装指南来安装 Tailwind CSS。然后你需要将以下代码添加到你的 tailwind.config.cjs 文件中

注意：如果你正在使用 pnpm 和 monorepo 架构，请确保你指向的是 ROOT node_modules

用法

现在你可以导入 HeroUI 组件并在你的 Astro 项目中使用它们

注意，你必须将 client:visible 添加到组件，使其仅在客户端可见。否则，HeroUI 组件的某些功能可能无法正常工作。