Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Conflict with ShadCN UI and Radix UI in Vercel Commerce Template after Update to Next.js 15 #1396

Open
salmanyammani opened this issue Oct 27, 2024 · 1 comment

Comments

@salmanyammani
Copy link

Description

I'm experiencing an issue using ShadCN UI with the Vercel Commerce template after it was recently updated to Next.js 15. Previously, ShadCN UI components worked well with this template, but since the update, they fail to load due to a conflict with Radix UI components.

Error Message

The following error appears when trying to use ShadCN UI components:
Module not found: Can't resolve '@radix-ui/react-dropdown-menu'

Steps to Reproduce

  1. Clone the latest Vercel Commerce template (Next.js 15).
  2. Install ShadCN UI components as per the official documentation.
  3. Attempt to import and use any ShadCN UI component (e.g., DropdownMenu).
  4. The module resolution error for Radix UI components occurs.

Expected Behavior

The ShadCN UI components should integrate seamlessly with the Vercel Commerce template, as they did in previous versions.

What I Tried

Reinstalled all dependencies and removed node_modules and lock files.
Verified that ShadCN UI works with a clean Next.js 15 project (outside of the Vercel Commerce template).
Tried manually adding @radix-ui/react-dropdown-menu to package.json, but the issue persists.

Environment

Next.js: 15.0.0-rc.1
ShadCN UI: 10.8.3
Radix UI: 10.8.3
Package Manager: pnpm
err-vercel-commerce

Additional Context

I suspect this is related to a compatibility issue between Radix UI components within ShadCN and the specific versions used in the Vercel Commerce template, as they are embedded deeply in ShadCN. A workaround or guidance would be greatly appreciated.

@dharmveer97
Copy link
Contributor

Description

I'm experiencing an issue using ShadCN UI with the Vercel Commerce template after it was recently updated to Next.js 15. Previously, ShadCN UI components worked well with this template, but since the update, they fail to load due to a conflict with Radix UI components.

Error Message

The following error appears when trying to use ShadCN UI components: Module not found: Can't resolve '@radix-ui/react-dropdown-menu'

Steps to Reproduce

  1. Clone the latest Vercel Commerce template (Next.js 15).
  2. Install ShadCN UI components as per the official documentation.
  3. Attempt to import and use any ShadCN UI component (e.g., DropdownMenu).
  4. The module resolution error for Radix UI components occurs.

Expected Behavior

The ShadCN UI components should integrate seamlessly with the Vercel Commerce template, as they did in previous versions.

What I Tried

Reinstalled all dependencies and removed node_modules and lock files. Verified that ShadCN UI works with a clean Next.js 15 project (outside of the Vercel Commerce template). Tried manually adding @radix-ui/react-dropdown-menu to package.json, but the issue persists.

Environment

Next.js: 15.0.0-rc.1 ShadCN UI: 10.8.3 Radix UI: 10.8.3 Package Manager: pnpm err-vercel-commerce

Additional Context

I suspect this is related to a compatibility issue between Radix UI components within ShadCN and the specific versions used in the Vercel Commerce template, as they are embedded deeply in ShadCN. A workaround or guidance would be greatly appreciated.

💡 To make it easier for others to investigate this issue, I recommend creating a sandbox environment (e.g., using CodeSandbox or StackBlitz). This will allow others to explore and troubleshoot the problem directly.

Providing a live, interactive example will make it simpler for contributors to understand and offer targeted solutions. 🙌
Thank you!!!!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants