Vite
Install and configure Vite.
1
Create project
Run the init command to create a new Vite project or to setup an existing one:
pnpm dlx shadcn-vite@latest init
You can use the -d flag for defaults i.e new-york, zinc and yes for the css variables.
2
Configure components.json
You will be asked a few questions to configure components.json:
1 Which style would you like to use? › New York2 Which color would you like to use as base color? › Zinc3 Where is your global CSS file? › src/index.css4 Would you like to use CSS variables for colors? › yes5 Where is your tailwind.config.js located? › tailwind.config.js6 Configure the import alias for components? › ~/components7 Configure the import alias for utils? › @acme/ui/lib/utils
3
Add components
Use the CLI to add components to your project:
pnpm dlx shadcn-vite@latest add button