A complete step-by-step guide to quickly set up **React + Vite + Tailwind CSS + Shadcn UI * with clean @/... alias imports — no TypeScript required!*

⏱️ Time to complete : ~10 minutes

🎯 Result : Production-ready React app with beautiful, accessible components

🧩 Step 1: Create a Vite + React Project

Scaffold your new project with Vite:

npm create vite@latest my-app cd my-app

Enter fullscreen mode

Exit fullscreen mode

When prompted, select:

Option | Choice

Framework | React

Variant | JavaScript

✅ Vite will generate a lean, fast React starter with HMR (Hot Module Replacement) out of the box.

🌀 Step 2: Install Dependencies

Install core packages and Tailwind's official Vite plugin:

npm install npm install tailwindcss @tailwindcss/vite

Enter fullscreen mode

Exit fullscreen mode

Package Purpose

tailwindcss Utility-first CSS framework

@tailwindcss/vite First-party Vite plugin for Tailwind (no PostCSS config needed!)

🎨 Step 3: Configure vite.config.js

Replace the entire contents of…