I tried Shadcn CLI 3.0 - here's what I learned - LogRocket Blog

"I'll detail out these additions to Shadcn CLI 3.0 - namespaced registries, private registry, enhanced search and discovery, and MCP server integration. Let's get right into it. What are registries? Think of a registry as a component library store. It's a place where UI components (like buttons, forms, cards) are stored and can be downloaded. Before 3.0, Shadcn only had one "store" (the default Shadcn registry). Now you can have multiple stores."

"You will first run the command below: npm create vite@latest npm install tailwindcss @tailwindcss/vite Next, replace the contents of index.css with this: @import "tailwindcss"; You will then need to add the baseUrl and paths properties to the compilerOptions section of the tsconfig.json file: { "files" : [], "references" : [ { "path" : "./tsconfig.app.json" }, { "path" : "./tsconfig.node.json" } ], "compilerOptions" : { "baseUrl" : ".", "paths" : { "@/*" : ["./src/*"] } } }"

"Next, add this to the content of tsconfig.app.json file: "baseUrl" : ".", "paths" : { "@/*" : [ "./src/*" ] }, Next, run the following command: npm install -D @types/node This command installs TypeScript type definitions for Node.js.This is a path utility that we need in the vite.config.ts file. You will thereafter add the following to vite.config.ts file: import path from "path"; import tailwindcss from "@tailwindcss/vite"; import react from "@vitejs/plugin""

Shadcn CLI 3.0 expands registry capabilities by adding namespaced registries and private registry support, enabling multiple component stores and private hosting. The release improves search and discovery and integrates an MCP server for enhanced component management. Setup guidance covers creating a Vite React project, installing Tailwind CSS and its Vite plugin, and modifying tsconfig baseUrl and paths for module resolution. Additional steps include replacing index.css import, installing @types/node for TypeScript, and adding path and plugin imports in vite.config.ts. The update streamlines component discovery, installation, and integration into development workflows.

Read at LogRocket Blog