Vitesse for Nuxt 4

?? Online Preview

Features

• ?? Nuxt 4 - SSR, ESR, File-based routing, components auto importing, modules, etc.

• ?? Vite - Instant HMR.

• ?? UnoCSS - The instant on-demand atomic CSS engine.

• ?? Use icons from any icon sets in Pure CSS, powered by UnoCSS.

• ?? The <script setup> syntax.

• ?? State Management via Pinia, see ./app/composables/user.ts.

• ?? Layout system.

• ?? APIs auto importing - for Composition API, VueUse and custom composables.

• ?? Zero-config cloud functions and deploy.

• ?? TypeScript, of course.

• ?? PWA with offline support and auto-update behavior.

Plugins

Nuxt Modules

• VueUse - collection of useful composition APIs.
• ColorMode - dark and Light mode with auto detection made easy with Nuxt.
• UnoCSS - the instant on-demand atomic CSS engine.
• Pinia - intuitive, type safe, light and flexible Store for Vue.
• VitePWA - zero-config PWA Plugin for Nuxt 4.
• DevTools - unleash Nuxt Developer Experience.

IDE

We recommend using VS Code with Volar to get the best experience (You might want to disable Vetur if you have it).

Variations

• vitesse - Opinionated Vite Starter Template
• vitesse-lite - Lightweight version of Vitesse
• vitesse-nuxt-bridge - Vitesse for Nuxt 2 with Bridge
• vitesse-webext - WebExtension Vite starter template

Try it now!

Online

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 antfu/vitesse-nuxt my-nuxt-app
cd my-nuxt-app
pnpm i # If you don't have pnpm installed, run: npm install -g pnpm