How to install Shadcn UI in React, Vite and Typescript

In this video, I'm going to teach how to set up Shadcn/ui in React with Vite using Typescript. We will learn from the official Shadcn Doc, so the installation is step-by-step and easy to understand

If you want to know how to set up shadcn/ui in React Typescript projects, this video tutorial will help you install Shadcn successfully.

[keifer]

Nice vid. I followed the steps precisely but for some reason, it created a folder called "@" in my root directory. This folder had the "components" and "lib" folders inside it. Why might that have happened? And how do I fix it?

Thanks

[bimangunarathne]

hi in my project there is not creating component folder when i install the component did you know how to fix that

[ayoubzo]

thank you this is really helpful love you

[HaiderAli-wjtx]

thank you so much
very helpful for me

[roubilridlo]

i already have custom css, and already have configured tailwind.config.css
its basically i using tailadmin template and wanna add shadcn ui in it. can you teach me how to do it?
sorry for my bad english

[Jayemby]

my tsconfig.json doesn't have compilerOptions when I go to load it. I've followed all the steps. When I try to just add it instead, then I just get loads of 'Cannot find module ‘@/components/ui/button' errors even though I've installed all the components later.

[randombasketballguy]

I’m getting an error that says “Cannot find module ‘@/components/ui/button’ or it’s corresponding type declarations. Any ideas how to fix it?