Production-ready Vue 3 + Vite + Vercel project scaffolder. One command creates a full-stack app with Tailwind CSS v4, Pinia state management, optional Vue Router, serverless API routes, automated testing, and pre-commit formatting hooks. Cross-platform CLI that detects your package manager and gets out of your way.
Setting up a new Vue project meant stitching together a dozen tools manually: Vite, Tailwind CSS, router, state, linting, formatting, testing, serverless functions, git hooks. Every new project was an hour of configuration before writing your first line of real code.
# The old way: 20+ manual steps
npm create vite@latest my-app -- --template vue
cd my-app
npm install
npm install -D @tailwindcss/vite tailwindcss
npm install pinia vue-router @unhead/vue
npm install -D vitest @vue/test-utils jsdom
npm install -D eslint prettier husky
# ...then manually configure each one, create vercel.json, write hooks...
# The new way: one command
npm create vvv@latest my-app
cd my-app
npm run dev
Cross-platform CLI auto-detects npm, pnpm, yarn, or bun. Non-interactive mode for CI/CD. No shell scripting, no platform gotchas.
Loaded via @tailwindcss/vite.
No config file needed. Optional DaisyUI component library.
Vercel serverless functions live in api/.
Environment variables pre-configured for frontend and backend.
Vitest + Vue Test Utils for testing. ESLint v9 + Prettier for code quality. Husky pre-commit hook auto-formats every commit.
| Layer | Technology | Version |
|---|---|---|
| Framework | Vue 3 + Composition API | ^3.5
|
| Build tool | Vite | ^6.0
|
| CSS | Tailwind
CSS via
@tailwindcss/vite
|
^4.0
|
| State | Pinia | ^2.2
|
| Head/SEO | @unhead/vue | ^1.11
|
| Routing (optional) | Vue Router | ^4.4
|
| UI (optional) | DaisyUI | ^5.0
|
| Serverless | Vercel Functions | N/A |
| Testing | Vitest + @vue/test-utils | ^3.0 / ^2.4
|
| Linting | ESLint v9 + eslint-plugin-vue | ^9.0
|
| Formatting | Prettier | ^3.3
|
| Git hooks | Husky | ^9.0
|
All flags are optional and compose freely. Use --yes for
fully automated scaffolding in CI/CD.
| Flag | Default | Description |
|---|---|---|
--yes
/ -y
|
false | Non-interactive mode. Accepts all defaults; combine with other flags to override. |
--router
|
false | Pre-selects Vue Router without prompting. |
--daisyui
|
false | Pre-selects DaisyUI component library without prompting. |
--git
|
auto | Forces git initialization. |
--no-git
|
false | Skips git initialization entirely. |
--skip-install
|
false | Copies template files but skips dependency install. |
npm create vvv@latest
# Prompts for project name, router, DaisyUI, git init
npm create vvv@latest my-app
# Skips name prompt, asks remaining questions
npm create vvv@latest .
# Scaffolds into current directory (must be empty)
pnpm create vvv@latest my-app
yarn create vvv my-app
bun create vvv my-app
npm create vvv@latest my-app --yes --router --no-git
# Router included, DaisyUI skipped, no git, no prompts
npm create vvv@latest my-app --yes --daisyui --skip-install
# DaisyUI selected, files copied but no npm install
cd my-app
npm run dev # Vite dev server at localhost:5173
npm run build # Production build → dist/
npm test # Vitest single run
npm run format # Prettier auto-format
vercel --prod # Deploy to Vercel
Every generated project includes vercel.json
pre-configured for SPA routing and serverless functions.
npm i -g vercel
vercel # preview
vercel --prod # production
Or connect to GitHub and push to main
for automatic production deploys.
| Requirement | Minimum | Notes |
|---|---|---|
| Node.js | 20
|
CLI exits with clear error if not met |
| Package manager | any current | npm, pnpm, yarn, or bun. Auto-detected. |
| Git | any | Optional. Only needed if you select git initialization. |
No global install. No repo cloning. One command.
npm create vvv@latest
View on npm