Next.js 15 に shadcn/ui をinstallするときのエラー解決

はじめに

通常通りにinstallしようとすると依存関係のエラーが出力されますが、
出力してくれているオプションつければinstallできます

問題

こんな感じでNext15にshadcnをinstallしようとすると依存関係のエラーが出力されます。

npx create-next-app@latest my-app
cd my-app
npx shadcn@latest init

Something went wrong. Please check the error below for more details.
If the problem persists, please open an issue on GitHub.

Command failed with exit code 1: npm install tailwindcss-animate class-variance-authority lucide-react @radix-ui/react-icons clsx tailwind-merge
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR! 
npm ERR! While resolving: my-app@0.1.0
npm ERR! Found: react@19.0.0-rc-69d4b800-20241021
npm ERR! node_modules/react
npm ERR!   react@"19.0.0-rc-69d4b800-20241021" from the root project
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! peer react@"^16.x || ^17.x || ^18.x" from @radix-ui/react-icons@1.3.0
npm ERR! node_modules/@radix-ui/react-icons
npm ERR!   @radix-ui/react-icons@"*" from the root project
npm ERR! 
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.

解決方法

shadcn のinstallコマンドに --legacy-peer-deps をつけるだけでOK！

npx create-next-app@latest my-app
cd my-app
npx --legacy-peer-deps shadcn@latest init

おわりに

少々面倒ですが、コンポーネントのinstall時にも必要なのでご注意を！

npx --legacy-peer-deps shadcn@latest add button

追記

公式がFix方法を載せていたので置いておきます
https://ui.shadcn.com/docs/react-19

参考