スキル

Nuxt UIスキルをインストールして、AIコーディングエージェントにコンポーネント、テーマ、ベストプラクティスに関する深い知識を提供します。

スキルとは？

スキルは、AIコーディングエージェントにライブラリ、フレームワーク、またはコードベースに関するコンテキストを与える構造化された知識ファイルです。リアルタイムのツールアクセスを提供するMCPサーバーとは異なり、スキルはエージェントのコンテキストに直接ロードされるため、会話中にそれらを参照できます。

Nuxt UIはusage skillを提供し、AIエージェントにNuxt UIを使ってUIインストール、テーマ設定、コンポーネント、コンポジブル、フォーム、オーバーレイ、レイアウトを構築する方法を教えます。

使用法

使用スキルにより、AIエージェントはNuxt UI v4を使用したビルドに関する包括的な知識を得ることができます。

  • Nuxt、Vue、Laravel、AdonisJS用のインストール
  • セマンティックカラーとCSS変数によるテーマとブランディング
  • 小道具と使用パターンを含む125以上のコンポーネントすべて
  • Composables useToast useOverlay defineShortcuts 標準スキーマによる- Form検証
  • Layoutコンポジション（ダッシュボード、ドキュメント、チャット、エディタ）
  • 公式スターターテンプレート

このスキルには、AIエージェントがタスクに基づいてオンデマンドでロードする追加の参照が含まれ、応答に焦点を当て、コンテキスト効率を維持します。

インストール後は、エージェントのチャットで/nuxt-uiと入力してスキルを呼び出すことができます。

Skills CLI

skills CLIはNuxt UIスキルをインストールする最も簡単な方法です。Cursor、Claude Code、Codex、Windsurf、Clineなどを含む35以上のエージェントをサポートしています。

npx skills add nuxt/ui

--agentフラグで特定のエージェントをターゲットにできます。

npx skills add nuxt/ui --agent cursor
npx skills add nuxt/ui --agent claude-code

または、グローバルにインストールして、スキルをすべてのプロジェクトで利用できます。

npx skills add nuxt/ui --global

GitHubからのクローン作成がネットワーク上で遅い場合は、代わりにWebサイトから直接インストールできます。

npx skills add https://ui.nuxt.com
スキルエコシステムの詳細と利用可能なスキルについては、skills.shをご覧ください。

カーソル

クイックインストール

下のボタンをクリックしてNuxt UIスキルをカーソルに直接インストールします。

Install Skill

手動設定

  1. カーソルを開き、「設定」>「スキル」に移動します。
  2. 「スキルを追加」をクリックし、以下のURLを入力します。
https://github.com/nuxt/ui/tree/v4/skills/nuxt-ui

Claudeコード

**Claude Codeがインストールされていることを確認してください。**インストール手順はAnthropicのドキュメントをご覧ください。

CLIコマンドを使用してスキルを追加します。

claude skill add https://github.com/nuxt/ui/tree/v4/skills/nuxt-ui

その他のAIツール

スキルファイルはGitHubで公開されています。カスタムコンテキストや指示をサポートするAIツールで直接参照できます。

LLMs.txt

How to get AI tools like Cursor, Windsurf, GitHub Copilot, ChatGPT, and Claude to understand Nuxt UI components, theming, and best practices.