📦

nuxt

Name: nuxt
Author: onmax

Безопасно 🌐 Доступ к сети📁 Доступ к файловой системе

Разработка приложений на Nuxt 4+

Также доступно от: antfu

Разработчикам нужна инструкция по шаблонам Nuxt 4 для серверных маршрутов, маршрутизации на основе файлов, middleware, плагинов и конфигурации. Этот навык предоставляет прогрессивную справочную документацию с последними конвенциями Nuxt и примерами.

Поддерживает: Claude Codex Code(CC)

🥉 76 Бронза

Скачать ZIP навыка

Загрузить в Claude

Перейдите в Settings → Capabilities → Skills → Upload skill

Включите и начните использовать

Протестировать

Использование «nuxt». Create a Nuxt 4 server route with Zod validation

Ожидаемый результат:

Create the route file: server/api/users.ts
Import Zod and define input schema with z.object()
Use readBody() or getQuery() to get input
Validate with schema.parse() and return validation errors
Return typed response with proper status codes

Использование «nuxt». Set up global authentication middleware

Ожидаемый результат:

Create middleware/auth.global.ts
Use defineNuxtRouteMiddleware() for type safety
Check auth state from store or session
Return navigateTo() for redirects (not router.push())
Export default function for Nuxt 4 compatibility

Аудит безопасности

Безопасно

v1 • 2/9/2026

Documentation-only skill containing markdown reference files for Nuxt 4+ development. All static findings are false positives from markdown code examples. No executable code, network calls, or credential access.

Просканировано файлов

2,074

Проанализировано строк

находки

Всего аудитов

Факторы риска

🌐 Доступ к сети (5)

references/middleware-plugins.md:276-278 references/nuxt-components.md:26-162 references/nuxt-composables.md:16-322 references/nuxt-config.md:25-419 SKILL.md:78-80

📁 Доступ к файловой системе (1)

references/project-setup.md:40-55

Проверено: claude

Оценка качества

Архитектура

100

Сопровождаемость

Контент

Сообщество

100

Безопасность

Соответствие спецификации

Что вы можете построить

Создание API-эндпоинтов

Build server routes with validation, WebSocket support, and SSE using h3 helpers and Nitro patterns.

Настройка маршрутизации и middleware

Configure file-based routing, route groups, authentication middleware, and navigation guards.

Конфигурация проектов Nuxt

Set up nuxt.config.ts with modules, runtime config, auto-imports, and project layers.

Попробуйте эти промпты

Создание серверного маршрута

I need to create a Nuxt 4 server route at /api/users that returns a list of users with validation. Load references/server.md for h3 validation patterns and proper route structure.

Добавление middleware маршрута

I want to add authentication middleware that redirects unauthenticated users. Load references/middleware-plugins.md to see Nuxt 4 middleware patterns and global vs named middleware.

Конфигурация runtimeConfig

How do I configure runtimeConfig in nuxt.config.ts to access environment variables on the server side? Show references/nuxt-config.md patterns for private and public config.

Использование Nuxt composables

I need to make a fetch request in my Nuxt page. Load references/nuxt-composables.md to see how useFetch works and proper SSR considerations.

Лучшие практики

Use named exports for route middleware instead of global unless truly global
Return navigateTo() from middleware, never use router.push() directly
Validate API inputs with Zod schema at the route handler level
Use useFetch() with proper keys for SSR data fetching and caching

Избегать

Using Vue 3 router.push() instead of navigateTo() in middleware
Skipping input validation on server routes
Mixing client and server-only code without proper runtimeConfig usage
Not using .global.ts suffix for global middleware

Часто задаваемые вопросы

What is the difference between named and global middleware in Nuxt 4?

Named middleware runs only when explicitly applied via definePageMeta(). Global middleware must use .global.ts suffix and runs on every route change. Use global only when truly needed across all routes.

How do I validate API request bodies in Nuxt server routes?

Use Zod with readBody() for POST/PUT requests. Import z, define a schema with z.object(), then call schema.parse(body) to validate. Return 400 status with errors if validation fails.

What is the proper way to handle environment variables?

Use runtimeConfig in nuxt.config.ts. Private keys (server-only) use process.env.API_SECRET. Public keys (client-accessible) use process.env.PUBLIC_API_BASE. Never expose private keys to the client bundle.

How do I use Nuxt composables vs Vue composables?

Nuxt composables are auto-imported from ~/composables or packages. Use Nuxt-specific ones like useFetch, useRequestURL, useRuntimeConfig. For general Vue patterns, use the Vue skill with VueUse examples.

What is the recommended project structure for Nuxt 4?

Standard structure: pages/, components/, composables/, middleware/, plugins/, server/, utils/, assets/. Use app/ for app-level directories. Place nuxt.config.ts at project root.

How do I create route groups in Nuxt 4?

Wrap folder names in parentheses like (admin)/. This creates a route group without adding a path segment. Useful for grouping routes with shared layouts or middleware.