Molayo

© 2026 Molayo

GitHub요약2026. 05. 20. 13:42

onmax/nuxt-skills

요약

onmax/nuxt-skills는 Vue, Nuxt 및 NuxtHub 개발을 지원하기 위해 설계된 AI 코딩 어시스턴트용 기술(skills) 패키지입니다. Claude Code, Cursor, GitHub Copilot 등 다양한 AI 에이전트와 호환되며, CLI를 통해 간편하게 설치하고 사용할 수 있습니다.

핵심 포인트

  • Vue 3, Nuxt 4+, NuxtHub 등 Nuxt 생태계 전반에 걸친 전문적인 기술 지원
  • Claude Code, Cursor, Codex, GitHub Copilot 등 주요 AI 코딩 도구와 호환
  • npx 명령어를 통한 간편한 설치 및 대화형 CLI 인터페이스 제공
  • Nuxt 모듈 제작, 인증, UI 컴포넌트, 문서 작성 등 세분화된 기술 항목 포함

HugoRCD의 작업에서 영감을 받은 디자인

AI 코딩 어시스턴트(AI coding assistants)를 위한 Vue, Nuxt 및 NuxtHub 기술(skills).

npx skills add onmax/nuxt-skills

skills

CLI는 설치된 에이전트(agents)를 자동으로 감지하고 대화형 선택기(interactive picker)를 제공합니다. 전역(사용자 전체) 설치를 위해 -g를 사용하거나, 모든 기술(skills)을 설치하려면 -y를 사용하세요.

Claude Code, Cursor, Codex, OpenCode, GitHub Copilot, Antigravity, Roo Code 등과 함께 작동합니다.

Claude Code 사용자를 위한 대안:

# 마켓플레이스(marketplace) 추가
/plugin marketplace add onmax/nuxt-skills
# Nuxt Skills 설치
...

Claude Code는 Nuxt Skills를 하나의 플러그인(plugin)으로 설치하며, 포함된 모든 기술 항목(skill entries)을 동적으로 찾아냅니다.

저장소(repository)를 클론(Clone)하고 기술(skill) 폴더를 에이전트의 기술 디렉토리로 복사하세요:

에이전트 (Agent)프로젝트 경로 (Project path)전역 경로 (Global path)
Claude Code.claude/skills/~/.claude/skills/
Cursor.cursor/skills/~/.cursor/skills/
Codex.codex/skills/~/.codex/skills/
OpenCode.opencode/skill/~/.config/opencode/skill/
Copilot.github/skills/—
기술 (Skill)설명 (Description)
vueVue 3 Composition API, 컴포넌트 (components), 컴포저블 (composables), 테스트 (testing)
nuxtNuxt 4+ 서버 라우트 (server routes), 라우팅 (routing), 미들웨어 (middleware), 설정 (config)
nuxt-modulesdefineNuxtModule을 이용한 Nuxt 모듈 제작, Kit 유틸리티 (Kit utilities), 테스트 (testing)
nuxthubNuxtHub v0.10 데이터베이스 (database), KV, blob, 캐시 (cache), 멀티 클라우드 (multi-cloud)
nuxt-contentNuxt Content v3 컬렉션 (collections), 쿼리 (queries), MDC 렌더링 (MDC rendering), NuxtStudio
nuxt-uiNuxt UI v4 컴포넌트 (components), 테마 (theming), 폼 (forms), 오버레이 (overlays), 컴포저블 (composables)
nuxt-better-auth@onmax/nuxt-better-auth를 이용한 인증 (Auth), useUserSession, 경로 보호 (route protection), clientOnly
reka-uiReka UI 헤드리스 (headless) Vue 컴포넌트, 접근 가능한 프리미티브 (accessible primitives), props/emits/slots
document-writerNuxt 생태계를 위한 문서 작성 - MDC, 스타일 (style), 구조 (structure), 코드 예제 (code examples)
ts-libraryTypeScript 라이브러리 저작 - exports, tsdown, API 패턴 (API patterns), 타입 트릭 (type tricks), CI
motionMotion Vue 애니메이션 (animations) - motion 컴포넌트 (motion component), 컴포저블 (composables), 스크롤 (scroll), 제스처 (gestures)
vueuseVueUse 컴포저블 (composables) - 상태 (state), 브라우저 (browser), 센서 (sensors), 네트워크 (network), 애니메이션 유틸리티 (animation utilities)
nuxt-seoNuxt SEO 메타 모듈 (meta-module) - robots, 사이트맵 (sitemap), og-image, schema-org, 사이트 설정 (site config)
vitestVitest 테스트 (testing) - 테스트 API (test API), 모킹 (mocking), 커버리지 (coverage), 타입 테스트 (type testing), 환경 (environments)
viteVite 빌드 도구 (build tool) - 설정 (config), 플러그인 (plugins), HMR, SSR, 라이브러리 모드 (library mode), 성능 (performance)
pnpmpnpm 패키지 매니저 (package manager) - 워크스페이스 (workspaces), 카탈로그 (catalogs), CLI 명령 (CLI commands), CI/CD
tsdowntsdown 번들러 (bundler) - TypeScript 라이브러리 (TypeScript libraries), DTS 생성 (DTS generation), 패키지 검증 (package validation)
tresjsTresJS 3D 프레임워크 (framework) - TresCanvas, Cientos 헬퍼 (helpers), 포스트 프로세싱 효과 (post-processing effects)
writing-web-documentation개발자 문서 작성 및 검토 - 페이지 유형 (page types), 하우스 스타일 (house style), 템플릿 (templates), 웹 프로젝트 규칙 (web-project rules)

기술 (Skills)은 Agent Skills 오픈 포맷을 따릅니다. 두 가지 방식으로 활성화할 수 있습니다:

자동 검색 (Auto-discovery)— 에이전트가 각 기술의 description을 읽고, 사용자의 작업과 관련이 있을 때 이를 로드합니다.
수동 호출 (Manual invocation)— /skill-name (예: /nuxt)을 입력하여 기술을 명시적으로 로드합니다.

당신이 작업 중인 내용...에이전트가 자동 로드할 수 있는 기술...
.vue 파일vue 기술
server/api/ 라우트nuxt 기술
nuxt.config.tsnuxt 기술
NuxtHub 스토리지nuxthub 기술
인증/로그인/세션nuxt-better-auth

Agent Skills 표준 형식을 따릅니다.

nuxt-skills/
├── skills/ # 기술 (agentskills 형식)
│ ├── vue/
...

기술은 GitHub Actions를 통해 최신 상태로 유지됩니다:

워크플로 (Workflow)일정 (Schedule)목적 (Purpose)
update-skills.yml매주 (월요일)업스트림 (upstream)으로부터 reka-ui, nuxt-ui, vueuse 문서를 재생성합니다
skill-maintenance.yml격주 (1일 및 15일)Claude가 업스트림 변경 로그 (changelogs)를 분석하고, 업데이트가 필요한 경우 PR을 생성합니다

유지보수 워크플로는 claude-code-action을 사용하여 업스트림 소스로부터 파괴적 변경 사항 (breaking changes), 새로운 기능, 그리고 지원 중단 (deprecations) 사항을 지능적으로 감지합니다.

  • Agent Skills Spec - AI 에이전트 역량 확장을 위한 오픈 형식
  • Claude Code Skills - Claude Code 내의 기술들
  • VS Code Agent Skills - VS Code 내의 GitHub Copilot 기술들
  • GitHub Agent Skills Docs - 에이전트 기술에 관한 문서
  • OpenCode Skills - OpenCode 내의 에이전트 기술들
  • awesome-copilot - 커스텀 에이전트 및 프롬프트 커뮤니티 컬렉션

vue 기술 주의사항: vuejs-ai/skills의 vue-best-practices (200개 이상의 규칙)
vitest, vite, pnpm, tsdown 기술: @antfu의 기술들

MIT

AI 자동 생성 콘텐츠

본 콘텐츠는 GitHub AI Coding Assistants의 원문을 AI가 자동으로 요약·번역·분석한 것입니다. 원 저작권은 원저작자에게 있으며, 정확한 내용은 반드시 원문을 확인해 주세요.

원문 바로가기
0

댓글

0