125k

Remix

PreviousNext

Remix 用に shadcn/ui をインストールして構成します。

プロジェクトの作成

まず、create-remix を使用して新しい Remix プロジェクトを作成します。

pnpm create remix@latest my-app

CLI を実行します

shadcn init コマンドを実行してプロジェクトをセットアップします。

pnpm dlx shadcn@latest init

以上です

これで、プロジェクトへのコンポーネントの追加を開始できます。

pnpm dlx shadcn@latest add button

上記のコマンドは、Button コンポーネントをプロジェクトに追加します。次に、次のようにインポートできます:

app/routes/index.tsx
import { Button } from "~/components/ui/button"
 
export default function Home() {
  return (
    <div>
      <Button>Click me</Button>
    </div>
  )
}