Skip to content
Cursor Rules Generator
Fullstack4 sections

Nuxt Cursor Rules Template

Generate production-ready Nuxt Cursor rules for Project Rules (.mdc), AGENTS.md, or legacy .cursorrules. This template encodes stack-specific conventions for projects using Nuxt. Vue meta-framework with auto-imports, file-based routing, and server routes.

The Complete Nuxt Cursor Rules

The full rule set in all three formats Cursor understands — copy the one your project uses. Project Rules (.mdc) load per-file via globs, AGENTS.md is portable across AI tools, and .cursorrules is the legacy single-file format.

Replacing a legacy file? Read the guide to migrate .cursorrules to Cursor Project Rules (.mdc) before copying this template into your project.

.cursor/rules/nuxt-auto-imports.mdc
---
description: "Auto-Imports & Conventions"
alwaysApply: false
---
- Leverage Nuxt auto-imports: no manual imports for composables/components.
- Use useAsyncData() and useFetch() for data fetching.
- Use    spaces for indentation.
- Use camelCase for composable and function names.
- Place composables in composables/ directory for auto-import.
- Use auto-imported ref(), computed(), watch() from Vue.
.cursor/rules/nuxt-pages-routing.mdc
---
description: "Pages & Routing"
alwaysApply: false
---
- Use file-based routing under pages/ directory.
- Use [param].vue for dynamic routes.
- Use [...slug].vue for catch-all routes.
- Use definePageMeta() for per-page configuration (layout, middleware, auth).
- Use navigateTo() for programmatic navigation.
- Use middleware/ directory for route-level middleware with named exports.
.cursor/rules/nuxt-server.mdc
---
description: "Server & API Routes"
alwaysApply: false
---
- Use server/api/ for API endpoints with defineEventHandler().
- Use server/middleware/ for server-level middleware.
- Use useRuntimeConfig() for environment variables and public config.
- Use server routes with proper HTTP method handling (getMethod(), readBody()).
- Use server/utils/ for shared server utilities.
- Prefer Nitro storage (useStorage()) for KV and file storage.
.cursor/rules/nuxt-ssr-rendering.mdc
---
description: "SSR & Rendering Modes"
alwaysApply: false
---
- Use hybrid rendering: configure ssr per route with routeRules.
- Use <ClientOnly> for components that must not SSR.
- Use useHead() for per-page SEO meta and head management.
- Use useSeoMeta() for type-safe SEO configuration.
- Use server components (.server.vue) for server-only rendering.
- Use lazy loading with Lazy prefix for dynamic imports.

Customize These Rules

The generator below is preloaded with the Nuxt template. Adjust indentation, quotes, naming, add your own rules, then download — no need to start from scratch on the homepage.

What This Template Covers

Required guidance

  • - Auto-Imports & Conventions
  • - Pages & Routing
  • - Server & API Routes
  • - SSR & Rendering Modes

Default style

  • - Indentation: 2 spaces
  • - Quotes: single
  • - Semicolons: disabled
  • - Naming: camelCase

Frequently Asked Questions

What does the Nuxt Cursor rules template include?
It includes 4 rule sections covering auto-imports & conventions, pages & routing, server & api routes and other Nuxt development conventions.
Can I generate Nuxt Project Rules and AGENTS.md from the same template?
Yes. The generator can export the same stack-specific guidance as modern Project Rules (.mdc), AGENTS.md, or a legacy .cursorrules file.
Should I combine Nuxt with other Cursor rules templates?
Yes. You can combine Nuxt with related templates such as TypeScript, Tailwind CSS, Docker, or backend frameworks when your project uses multiple technologies.