botmaster/vuejs-vite-starter

⚡️ Vite + Vue + TS + Tailwind + Sass = Template

Vue.js Vite Starter Template -

⚠️ WIP

📢 This template fit to my workflow. It's constantly evolving.

Why?

Time saving. Setting up a Vue.js application from scratch takes time.

Largely inspired by Vitesse by Anthony Fu 🙏

Features

• ⚡️ Vue 3, Vite 3, pnpm

• 🎨 Tailwindcss - a utility-first CSS framework.

• 📜 Sass - Yes, I use Sass AND Tailwind.

• 🍍 State Management via Pinia

• 😃 Use icons from any icon sets thanks Iconify

• 🔥 Use the new <script setup> style

• 🦾 TypeScript, of course

• 🌍 i18n ready

• ⛲️ Fontaine Automatic font fallback based on font metrics

Upcoming features / Libs / Plugins

• ViteTest
• Storybook
• VueQuery
• Webfont self-hosting
• ...

Pre-packed

UI Frameworks

• Tailwindcss - a utility-first CSS framework.

Icons

• Iconify - use icons from any icon sets 🔍Icônes
• Iconify for Vue - Vue 3 commponent.

Plugins

• Headless UI
• Vue Router
• VueUse - collection of useful composition APIs
• Vite SVG Loader
• [Pinia] - Intuitive, type safe, light and flexible Store for Vue using the composition api
• Vue I18n - Internationalization
  • unplugin-vue-i18n - unplugin for Vue I18n
• vite-plugin-vue-devtools - Designed to enhance the Vue developer experience.
• Unhead - manipulate document head reactively
• Fontaine - Automatic font fallback based on font metrics

Try it now!

GitHub Template

Create a repo from this template on GitHub.

Clone to local

If you prefer to do it manually with the cleaner git history

npx degit botmaster/vuejs-vite-starter my-app
cd my-app
pnpm i # If you don't have pnpm installed, run: npm install -g pnpm