nuxt-modules — скилл для Claude Code: что делает и как установить
Скилл помогает создавать модули для Nuxt: локальные расширения в папке modules/, пакеты для npm, серверные роуты и плагины с настройкой тестов и CI/CD.
npx skills add onmax/nuxt-skills --skill nuxt-modules -a claude-codeЧто делает nuxt-modules
Скилл систематизирует разработку модулей под Nuxt с применением defineNuxtModule и утилит Nuxt Kit. Он задаёт структуру проекта с точкой входа в src/module.ts, изолированным рантайм-кодом (components, composables, plugins, server) и песочницей playground/ для ручной проверки в процессе кодинга.
Вся справочная база разбита на три файла: разработка и хуки (development.md), E2E-тестирование и публикация в npm (testing-and-publishing.md), а также шаблоны CI/CD (ci-workflows.md). Инструкция требует не загружать эти файлы разом, поэтому контекст агента не забивается лишними деталями.
Базовый шаблон создаётся через npx nuxi init -t module <имя>, а для логики внутри рантайма скилл опирается на соседние инструкции по nuxt и vue.
Какие задачи решает
- сконфигурировать локальный модуль Nuxt через
defineNuxtModule - внедрить рантайм-компоненты, плагины и серверные роуты через Nuxt Kit
- настроить E2E-тесты модуля в папке
test/fixtures/ - подготовить шаблоны CI/CD для публикации пакета в npm
Примеры запросов агенту
- Помоги написать локальный модуль Nuxt в
modules/для регистрации серверного middleware - Как настроить E2E-тестирование модуля Nuxt с помощью тестового playground?
- Сделай GitHub Actions workflow для публикации Nuxt-модуля в npm
Как установить nuxt-modules
1Через Skills CLI (Vercel)
npx skills add onmax/nuxt-skills --skill nuxt-modules -a claude-code2Вручную: положить файлы
~/.claude/skills/nuxt-modules/SKILL.mdПапка скилла целиком; для одного проекта — .claude/skills/nuxt-modules/
1Через Skills CLI (Vercel)
npx skills add onmax/nuxt-skills --skill nuxt-modules -a codex2Вручную: положить файлы
.agents/skills/nuxt-modules/SKILL.mdДля всех проектов — ~/.agents/skills/
1Через Skills CLI (Vercel)
npx skills add onmax/nuxt-skills --skill nuxt-modules -a cursor2Вручную: положить файлы
.cursor/skills/nuxt-modules/SKILL.mdCursor читает и .agents/skills/, и .claude/skills/
1GitHub CLI
gh skill install onmax/nuxt-skills nuxt-modules2Вручную: положить файлы
.github/skills/nuxt-modules/SKILL.md1Через Skills CLI (Vercel)
npx skills add onmax/nuxt-skills --skill nuxt-modules -a gemini-cli2Командой платформы
gemini skills install https://github.com/onmax/nuxt-skills --path skills/nuxt-modulesВручную: положить файлы
.devin/skills/nuxt-modules/SKILL.mdСтарый путь .windsurf/skills/ тоже читается
Через Skills CLI (Vercel)
npx skills add onmax/nuxt-skills --skill nuxt-modules -a opencodeClaude.ai
Упакуйте папку в zip и загрузите в Settings → Capabilities → Skills
По шагам, с командами для каждой платформы: Как установить скилл в Claude Code: пять способов
Из того же набора8
Похожие
Рядом в теме «Фронтенд и UI»
Всё по теме «Фронтенд и UI» →Вопросы о nuxt-modules
Как установить nuxt-modules в Claude Code?
Выполните команду npx skills add onmax/nuxt-skills --skill nuxt-modules -a claude-code.
Для каких типов модулей подходит этот скилл?
Скилл охватывает три варианта: опубликованные npm-пакеты с префиксами @nuxtjs/ или nuxt-, локальные модули проекта в папке modules/ и инлайн-хуки внутри nuxt.config.ts.
Какие справочные файлы входят в скилл?
В него входят руководства development.md по Nuxt Kit и хукам, testing-and-publishing.md по тестам и публикации в npm, а также ci-workflows.md с шаблонами для пайплайнов.
Исходный текст
SKILL.md · MIT
--- name: nuxt-modules description: "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." license: MIT --- # Nuxt Module Development Guide for creating Nuxt modules that extend framework functionality. **Related skills:** `nuxt` (basics), `vue` (runtime patterns) ## Quick Start ```bash 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 - **[references/development.md](references/development.md)** - Module anatomy, defineNuxtModule, Kit utilities, hooks - **[references/testing-and-publishing.md](references/testing-and-publishing.md)** - E2E testing, best practices, releasing, publishing - **[references/ci-workflows.md](references/ci-workflows.md)** - Copy-paste CI/CD workflow templates ## Loading Files **Consider loading these reference files based on your task:** - [ ] [references/development.md](references/development.md) - if building module features, using defineNuxtModule, or working with Kit utilities - [ ] [references/testing-and-publishing.md](references/testing-and-publishing.md) - if writing E2E tests, publishing to npm, or following best practices - [ ] [references/ci-workflows.md](references/ci-workflows.md) - if setting up CI/CD workflows for your module **DO NOT load all files at once.** Load only what's relevant to your current task. ## Module Types | Type | Location | Use Case | | --------- | ---------------- | -------------------------------- | | Published | npm package | `@nuxtjs/`, `nuxt-` distribution | | Local | `modules/` dir | Project-specific extensions | | Inline | `nuxt.config.ts` | Simple 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 - [Module Guide](https://nuxt.com/docs/guide/going-further/modules) - [Nuxt Kit](https://nuxt.com/docs/api/kit) - [Module Starter](https://github.com/nuxt/starter/tree/module)
© onmax · MIT · onmax/nuxt-skills