Vite Vue 3 TypeScript Starter

A rapid development starter kit using Vite, Vue3, TypeScript, Vitest, ESLint, Prettier, Husky, and UnoCSS.

Getting Started

Run

npx @xqsit94/vite-vue3-ts-starter my-vue-app

and follow the prompts.

Features

• 🚀 Fast development and build times with Vite
• 🖖 Vue 3 for UI components
• 🧭 Vue Router for client-side routing
• 🗄️ Pinia for state management
• 🦋 TypeScript for static type checking
• 📚 Interactive UI development and testing with Storybook
• ✅ Unit Testing with Vitest
• 🧹 Linting and formatting with ESLint and Prettier
• 🐶 Pre-commit checks using Husky
• 🎨 Optimized CSS with UnoCSS

Commands

Using npm

npm run dev             # Run the app in development mode.
npm run build           # Build the app for production using type-check and build-only.
npm run preview         # Serve the built app for preview.
npm run test:watch      # Run Vitest in watch mode.
npm run test            # Run Vitest without watch.
npm run lint            # Run ESLint to check for code issues.
npm run format          # Run Prettier to format code.
npm run postinstall     # Install Husky Git hooks.
npm run prepare         # Prepare Husky hooks.

Using Yarn

yarn dev             # Run the app in development mode.
yarn build           # Build the app for production using type-check and build-only.
yarn preview         # Serve the built app for preview.
yarn test:watch      # Run Vitest in watch mode.
yarn test            # Run Vitest without watch.
yarn lint            # Run ESLint to check for code issues.
yarn format          # Run Prettier to format code.
yarn postinstall     # Install Husky Git hooks.
yarn prepare         # Prepare Husky hooks.

Using pnpm

pnpm dev             # Run the app in development mode.
pnpm build           # Build the app for production using type-check and build-only.
pnpm preview         # Serve the built app for preview.
pnpm test:watch      # Run Vitest in watch mode.
pnpm test            # Run Vitest without watch.
pnpm lint            # Run ESLint to check for code issues.
pnpm format          # Run Prettier to format code.
pnpm postinstall     # Install Husky Git hooks.
pnpm prepare         # Prepare Husky hooks.