Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/dvlkit/nuxe/llms.txt

Use this file to discover all available pages before exploring further.

Nuxe is a meta-framework built on top of Vue 3, Vite, and vue-router. It layers a set of opinionated conventions — file-based routing, layouts, auto-imports, server-side rendering, and per-page head management — on top of the tools you already know, so you can ship production-ready Vue apps without spending time on boilerplate wiring. Where plain Vue 3 + Vite leaves routing, SSR, and component discovery entirely up to you, Nuxe provides sensible defaults for all of it while staying easy to extend through a minimal nuxe.config.ts.

Key Features

File-Based Routing

Drop .vue files into app/pages/ and Nuxe auto-discovers them as routes — no manual router configuration required. Nested folders map directly to nested URL paths.

SSR Out of the Box

Every app renders server-side by default. Run pnpm dev for an SSR dev server with HMR, and pnpm build && pnpm start for production — no extra config needed.

Auto-Imports

Components in app/components/ and composables in app/composables/ are automatically available everywhere in your templates and <script setup> blocks — zero manual imports.

Layouts

Define reusable layout shells in app/layouts/. Any page can opt into a layout via definePage({ meta: { layout: 'admin' } }). Pages without a layout declaration fall back to layouts/default.vue.

Head Management

The useHead composable (powered by @unhead/vue) sets <title> and <meta> tags per page. Tags are injected into the initial SSR HTML and updated during client-side navigation — no manual cleanup.

TypeScript-First

Nuxe ships full TypeScript support out of the box: typed routes, typed runtime config, and typed sub-exports from @dvlkit/nuxe. No extra setup required.

Runtime Config

Expose environment-specific values through runtimeConfig in nuxe.config.ts. Public values are available on both server and client via useRuntimeConfig(); private values stay server-only.

Server API Routes

Place handler files in server/api/ to create API endpoints served by the same process as your SSR app. Handlers use h3 primitives (defineEventHandler, getQuery, readBody, etc.) exported from @dvlkit/nuxe/server.

Route Middleware

Add navigation guards as files in app/middleware/. Suffix a file with .global to run it on every route, or .server.global to run it only during SSR. Define middleware logic with the auto-imported defineNuxeRouteMiddleware.

Scaffolding CLI

Bootstrap a new project in seconds with npm create nuxe@latest. The interactive CLI prompts for a project name, dev port, optional demo pages, and optional Tailwind CSS v4 integration.

Built on Vue 3, Vite, and vue-router

Nuxe is not a replacement for Vue 3 — it is a thin, opinionated layer on top of it. The rendering engine is Vue 3 (^3.4.0), the build tool is Vite (^8.0.0), and the router is vue-router (^5.0.0). All three are peer dependencies, so your project retains full access to the underlying APIs. Vite configuration is passed through as-is via the vite key in nuxe.config.ts, and vue-router’s <RouterLink> and <RouterView> components work exactly as you would expect. Nuxe simply wires everything together so you don’t have to.

Build docs developers (and LLMs) love