NU

nuxt-modules

Guides the creation, testing, and publishing of Nuxt modules and framework extensions.

Install

mkdir -p .claude/skills/nuxt-modules && curl -L -o skill.zip "https://agentskills.codes/api/skills/download/1831" && unzip -o skill.zip -d .claude/skills/nuxt-modules && rm skill.zip

Installs to .claude/skills/nuxt-modules

Activation

This is the description your AI agent reads to decide when to run this skill — the better it matches your request, the more reliably it fires.

Use when creating Nuxt modules: (1) Published npm modules (@nuxtjs/, nuxt-), (2) Local project modules (modules/ directory), (3) Runtime extensions (components, composables, plugins), (4) Server extensions (API routes, middleware), (5) Releasing/publishing modules to npm, (6) Setting up CI/CD workflows for modules. Provides defineNuxtModule patterns, Kit utilities, hooks, E2E testing, and release automation.
411 chars✓ has a “when” triggerlonger than Claude Code's old 250-char listing cap (fine on current versions)
Intermediate

Key capabilities

  • Implement defineNuxtModule patterns
  • Configure Nuxt module hooks
  • Set up E2E testing for modules
  • Automate module publishing workflows
  • Create runtime extensions like plugins and composables

How it works

The skill provides templates and patterns for extending Nuxt functionality, utilizing Kit utilities and hooks to integrate custom logic into the framework.

Inputs & outputs

You give it
Nuxt module development task
You get back
Module code structure and CI/CD configuration

When to use nuxt-modules

  • Developing local Nuxt modules
  • Publishing modules to npm
  • Creating Nuxt plugins and composables

About this skill

Nuxt Module Development

Guide for creating Nuxt modules that extend framework functionality.

Related skills: nuxt (basics), vue (runtime patterns)

Quick Start

npx nuxi init -t module my-module
cd my-module && npm install
npm run dev        # Start playground
npm run dev:build  # Build in watch mode
npm run test       # Run tests

Available Guidance

Loading Files

Consider loading these reference files based on your task:

DO NOT load all files at once. Load only what's relevant to your current task.

Module Types

TypeLocationUse Case
Publishednpm package@nuxtjs/, nuxt- distribution
Localmodules/ dirProject-specific extensions
Inlinenuxt.config.tsSimple one-off hooks

Project Structure

my-module/
├── src/
│   ├── module.ts           # Entry point
│   └── runtime/            # Injected into user's app
│       ├── components/
│       ├── composables/
│       ├── plugins/
│       └── server/
├── playground/             # Dev testing
└── test/fixtures/          # E2E tests

Resources

When not to use it

  • General Vue application development
  • Non-Nuxt related projects

Prerequisites

Nuxt development environment

Limitations

  • Limited to Nuxt framework module development

How it compares

It offers specific scaffolding and best-practice patterns for module distribution compared to manual project setup.

Compared to similar skills

nuxt-modules side by side with the closest alternatives in the catalog.

SkillInstallsUpdatedSafetyDifficulty
nuxt-modules (this skill)36moReviewIntermediate
shadcn-ui-setup378moReviewBeginner
landing-page-guide-v2488moReviewIntermediate
nextjs15-init89moReviewBeginner

Try saying

Example prompts that trigger this skill in your AI assistant.

You might also like

shadcn-ui-setup

maneeshanif

Install and configure Shadcn/ui component library with Radix UI primitives, Aceternity UI effects, set up components, and manage the component registry. Use when adding Shadcn/ui to a Next.js project or installing specific UI components for Phase 2.

37194

landing-page-guide-v2

bear2u

Create distinctive, high-converting landing pages that combine proven conversion elements with exceptional design quality. Build beautiful, memorable landing pages using Next.js 14+ and ShadCN UI that avoid generic AI aesthetics while following the 11 essential elements framework.

48105

nextjs15-init

bear2u

Use when user wants to create a new Next.js 15 project (Todo/Blog/Dashboard/E-commerce/Custom domain) with App Router, ShadCN, Zustand, Tanstack Query, and modern Next.js stack

8102

frontend-prompt-generator

gharam1234

Generate structured prompts for frontend development tasks following established patterns. Use when the user requests prompts for wireframes, UI implementation, data binding, or routing functionality in React/Next.js projects with specific formatting requirements (Cursor rules, file paths, test-driven development).

679

ai-sdk-5

prowler-cloud

Vercel AI SDK 5 patterns. Trigger: When building AI features with AI SDK v5 (chat, streaming, tools/function calling, UIMessage parts), including migration from v4.

316

prowler-ui

prowler-cloud

Prowler UI-specific patterns. For generic patterns, see: typescript, react-19, nextjs-15, tailwind-4. Trigger: When working inside ui/ on Prowler-specific conventions (shadcn vs HeroUI legacy, folder placement, actions/adapters, shared types/hooks/lib).

10

Search skills

Search the agent skills registry