How to install shadcn ui
Hey everyone! I absolutely love Wasp, but I have troubles installing shadcn ui properly. I could not find any docs online that would describe me how to do it without being able to use "npx". I have added the dependency in wasp.main, but it does not work.
Thanks for you help in explaining me how I can import components from external libraries.
Thanks a lot in advance for your support!
Solution:Jump to solution
Here's the gist: 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.
17 Replies
I think @martinsos @miho and @Filip will know the most here 🙂
I've tried before to install Shadcn but with no luck 😦
I think with 0.12 things will change, but in 0.11.8 I haven't been able to set it up
thanks for your response, Matija and Miho.
sad to hear that it is currently not possible... would speed up development significantly.
Have you made good experiences with other component libraries, @miho ?
We had luck with NextUI, Chakra UI and many others, maybe @Vinny (@Wasp) can chime in
yeah Chakra UI is my fav of the bunch
ok great! Thank you a lot, will try out Chakra UI then. Thanks for your support!
@wambofabio check out the source code of https://coverlettergpt.xyz/ for a fast start with Chakra UI: https://github.com/vincanger/coverlettergpt
CoverLetterGPT
Create Unique Cover Letters Based on Your Skills using GPT. Supercharge Your Job Search.
GitHub
GitHub - vincanger/coverlettergpt: Generate Cover Letters based on ...
Generate Cover Letters based on Job Description and your Resumé. Manage jobs and applications. Get Hired. Have fun. Be cool. Go to School. - GitHub - vincanger/coverlettergpt: Generate Cover Letter...
I also used it for my side project https://reflectdaily.app/ | https://github.com/matijaSos/reflect-daily
GitHub
GitHub - matijaSos/reflect-daily: Daily reflection app. Get 1% bett...
Daily reflection app. Get 1% better every day. Contribute to matijaSos/reflect-daily development by creating an account on GitHub.
Thanks a lot, will have a look!
@wambofabio shouldn't the manual installation work? https://ui.shadcn.com/docs/installation/manual NPX is basically copy-pasting this configuration for you
Manual Installation
Add dependencies to your project manually.
@miho forgot to mention, but important fact is also that Wasp v0.12 is coming out very soon, in a matter of days (next week latest), so if you really want to use chadcn it might be worth the wait.
Although this is interesting what Boris says also, this looks like it might work. @miho have you tried this?
Hi. Any news about how to setup Shadcn UI with Wasp v0.2?
Wasp 0.12 * and yes 🙂 it's now possible to do with some manual interventions but it works for me. Let me create a small gist with the instructions and I'll share it here 😄
Awesome, thank you.
Solution
Here's the gist: 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.
That was quick. Thank you so much 😉
Wohooo @Kamalito, you just became a Waspeteer level 1!