Vite
需求
- Vite 2 或更高版本
- React 18 或更高版本
- Tailwind CSS 3.4 或更高版本
- Framer Motion 11.9 或更高版本
若要在您的 Vite 專案中使用 NextUI，您需要依照以下步驟操作
NextUI CLI (推薦)
如果您正在開始一個新的專案，您可以使用NextUI CLI 來建立一個預先設定好 NextUI 的新專案
或
使用 NextUI + Vite 範本
如果您正在開始一個新的專案，您可以執行以下其中一個命令來建立一個預先設定好 NextUI 的 Vite 專案
自動安裝
您可以使用 CLI 新增個別組件。例如，新增按鈕組件
此命令會將 Button 組件新增至您的專案，並管理所有相關的相依性。
您也可以一次新增多個組件
或者，您可以透過執行以下命令新增主要程式庫 @nextui-org/react
如果您省略組件名稱，CLI 會提示您選取要新增的組件。
您仍然需要手動將 provider 新增到您的應用程式中（我們正在努力自動化此步驟）。
手動安裝
新增相依性
在您的 Vite React 專案中，執行以下其中一個命令來安裝 NextUI
提升的相依性設定
注意：此步驟僅適用於使用
pnpm安裝的使用者。如果您使用其他套件管理器安裝 NextUI，您可以略過此步驟。
如果您使用 pnpm，您需要在 .npmrc 檔案中新增以下行，以將我們的套件提升到根目錄 node_modules。
修改 .npmrc 檔案後，您需要再次執行 pnpm install，以確保正確安裝相依性。
Tailwind CSS 設定
NextUI 是建立在 Tailwind CSS 之上，因此您需要先安裝 Tailwind CSS。您可以依照官方的安裝指南來安裝 Tailwind CSS。然後，您需要將以下程式碼新增至您的 tailwind.config.js 檔案中
注意：如果您使用 pnpm 和 monorepo 架構，請確保您指向根目錄
node_modules
供應商設定
安裝 NextUI 後，您需要在應用程式的 root 處設定 NextUIProvider。
前往 src 目錄，並在 main.jsx 或 main.tsx 中，將 NextUIProvider 包裹在 App 周圍。
版本 2 僅與 React 18 或更高版本相容。如果您使用 React 17 或更早版本，請使用NextUI 的版本 1。
