4 Replies
Hi @Bruno Njeru. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:
----------------------
Short answer: follow the community gist for shadcn + Wasp, then add components via the same flow.
Here’s what we know from the sources:
- shadcn/ui can work with Wasp (including the OpenSaaS template) if you follow a set of manual steps shared in this gist: https://gist.github.com/infomiho/b35e9366e16913949e13eaba0538f553. Multiple users confirmed success after applying all changes and restarting the dev server. [shadcn gist; shadcn works]
Practical steps to add new shadcn components in OpenSaaS:
1) Make sure your OpenSaaS app is on a Wasp version that works with the gist (users reported success on 0.12+ and 0.13). Then carefully apply every change from the gist (file modifications and import paths). [How to install shadcn ui; has anyone got shadcn]
2) After you’ve integrated shadcn per the gist, add new components by:
- Copying the component files from shadcn/ui’s docs (manual installation) into your client codebase, matching the alias/paths set up in the gist.
- Adjusting imports to the paths you chose (e.g., using your alias for components).
- Restarting wasp start if the dev server is running, since users reported a restart sometimes resolves lingering errors. [How to install shadcn ui; has anyone got shadcn]
Notes and troubleshooting:
- NPX-based shadcn CLI isn’t directly used with Wasp; the gist shows the manual approach (equivalent to shadcn’s “manual installation” guide). [How to install shadcn ui]
- If you hit an error, share your Wasp version, exact steps, and where it fails—this was requested in the thread and helps others pinpoint issues. [has anyone got shadcn]
If you need, I can help walk through the gist changes step-by-step—just share your Wasp version and where you plan to place the components.
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------
Sorry @Bruno Njeru, I seem to be having a bit of trouble. Don't worry though, I've pinged my support and they will try to fix me up! :technologist:
Perhaps try again in 15mins?
opensaas v2 already comes with shadcn @kapa.ai
Let me check the knowledge base for you again. One moment! :books:
----------------------
I’m sorry, but the knowledge sources don’t state that OpenSaaS v2 ships with shadcn/ui out of the box. What we do have are community threads showing shadcn can be integrated into Wasp/OpenSaaS via a manual setup (using a community gist), and reports of it working on recent Wasp versions after following those steps. [How to install shadcn ui; has anyone got shadcn]
If you’re on OpenSaaS and need shadcn:
- Follow the manual integration gist and then copy components from shadcn’s docs into your project, adjusting imports as described there. Users confirmed success with this approach. [How to install shadcn ui; has anyone got shadcn]
If you can share a link that claims “OpenSaaS v2 includes shadcn,” I can cross-check and update the guidance.
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------
Sorry @Bruno Njeru, I seem to be having a bit of trouble. Don't worry though, I've pinged my support and they will try to fix me up! :technologist:
Perhaps try again in 15mins?
You'd install the components the usual way, but you'll need to use an older ShadCN version becuase Wasp is still using Tailwind 3 https://gist.github.com/infomiho/b35e9366e16913949e13eaba0538f553
Gist
Using ShadCN with Wasp 0.12+
Using ShadCN with Wasp 0.12+. GitHub Gist: instantly share code, notes, and snippets.