create-sackapp

CLI publicado en npm que te ahorra 20 minutos de configuración cada vez que arrancas un proyecto React nuevo. Te hace cuatro preguntas y te deja una carpeta lista para npm run dev con:

• ⚡ Vite + React (TypeScript o JavaScript, tú eliges)
• 🎨 TailwindCSS v4 (sin postcss config; plugin oficial de Vite)
• 🧩 shadcn/ui inicializado con el componente Button
• 🎯 Alias @/ funcionando en Vite y tsconfig (sin baseUrl deprecado)
• 🛠 cn() helper preescrito en src/lib/utils
• 📌 .nvmrc con Node 24 (evita el aviso de Vercel de deprecación de Node 18)
• 🎁 Opcionales: axios · zustand · sweetalert2 · toastify-js · useHooks · react-router-dom · @supabase/supabase-js

---

Uso

npm create sackapp@latest
# o
npx create-sackapp

Te pregunta:

1. Nombre de la app (default mi-app)
2. Lenguaje — TypeScript (recomendado) o JavaScript
3. shadcn/ui — sí / no (por defecto sí; instala componente Button)
4. Dependencias extra (multi-select con <space> para marcar)

Al terminar:

cd mi-app
npm run dev

Y ya tienes un proyecto funcionando con base moderna, sin configuración inicial que hacer.

---

Qué hace por dentro

1. npm create vite@latest <app> -- --template react[-ts]
2. npm install
3. Instala tailwindcss + @tailwindcss/vite (v4).
4. Reescribe src/index.css a un simple @import "tailwindcss";.
5. Reescribe vite.config.[jt]s con:
   • Plugin @tailwindcss/vite
   • Alias @/ → ./src/ usando fileURLToPath(new URL(...)) (compatible con ESM, sin __dirname roto).
6. Añade paths: { "@/*": ["./src/*"] } en tsconfig.app.json (o jsconfig.json si es JS). Sin baseUrl — no más warnings de deprecación de TS 7.
7. Instala clsx + tailwind-merge + class-variance-authority + lucide-react.
8. Escribe src/lib/utils.[jt]s con cn(...) listo para pegar a shadcn.
9. (Si eliges shadcn) Escribe components.json con config sensata y corre npx shadcn@latest add button --yes --overwrite.
10. Escribe .nvmrc con 24.
11. Instala los extras que hayas marcado.

Todo no-interactivo: no se cuelga esperando confirmaciones.

---

Estructura generada

mi-app/
├── src/
│   ├── App.tsx (o .jsx)
│   ├── main.tsx (o .jsx)
│   ├── index.css          # @import "tailwindcss"
│   ├── lib/
│   │   └── utils.ts       # cn(...) helper
│   └── components/
│       └── ui/
│           └── button.tsx # shadcn/ui Button
├── vite.config.ts         # con alias @/ (ESM correcto)
├── tsconfig.app.json      # con paths, sin baseUrl
├── components.json        # config shadcn
├── .nvmrc                 # 24
└── package.json           # ESM

---

Comparación con la versión anterior

	v1.x	v2.0
Tailwind	v3 (con postcss config)	v4 (plugin de Vite, sin postcss)
Alias en ESM	__dirname roto	✅ fileURLToPath(new URL(...))
TS config	con baseUrl deprecado	✅ solo paths
Elección de lenguaje	forzaba TS + template JS	✅ prompt TS / JS
shadcn init	interactivo (colgaba)	✅ config manual + add --yes
Node version	no configurado	✅ .nvmrc = 24
Extras	5 opciones	✅ 7 (añade toastify, supabase)

---

Desarrollo del CLI

git clone https://github.com/DarkSack/create-sackapp.git
cd create-sackapp
npm install
node index.js        # probar localmente

Publicar una versión nueva en npm:

npm version [patch|minor|major]
npm publish

---

Hecho con 💻 y ☕ por Sack.