vercel-labs/agent-skills

これは何？

主な機能

• 01npx skills addでインストールでき、関連するタスクが発生すると自動的に読み込まれます。
• 02コスト、キャッシュ、関数の使用状況を対象としたVercelプロジェクトの監査機能を備えています。
• 03バンドルサイズやデータ取得を扱う、ReactとNext.jsのパフォーマンスルールを提供します。
• 04100項目を超えるチェックを含む、UIアクセシビリティとデザインのレビュー基準を提供します。
• 05エージェントがプロジェクトをVercelにデプロイし、プレビューURLとclaim URLを返せます。

ユースケース

• ReactまたはNext.jsのコンポーネントをレビューし、レンダリングやバンドルのパフォーマンス上の問題を確認する。
• デプロイ済みのVercelプロジェクトを監査し、遅いルートや高額な関数コストを検出する。
• サイトのマークアップとスタイルがアクセシビリティガイドラインに沿っているか確認する。
• チャットセッションで作成したプロトタイプをデプロイし、共有可能なライブURLを取得する。

クイックスタート

1. 1

   npxでスキルをインストールします

   npx skills add vercel-labs/agent-skills
2. 2

   パフォーマンスの問題がないかReactコンポーネントをレビューするなど、スキルに合ったタスクをエージェントに依頼します

使う前に知っておきたいこと

• !リポジトリのメタデータにはライセンスの記載がありませんが、READMEにはMITと記載されています。
• !vercel-deploy-claimableのように、プロジェクトをVercelのデプロイサービスにアップロードするなど、Vercelのサービスに依存するスキルがあります。

トピック

よくある質問

agent-skills とは？

AIコーディングエージェントにVercel固有の知識やReact/Next.jsのベストプラクティスを提供する、インストール可能な指示パック集。 Agent Skillsは、AIコーディングエージェントに専門知識を追加する、パッケージ化された指示とスクリプトのセットです。各スキルは、Agent Skills形式に従ったSKILL.mdファイル、任意の補助スクリプト、リファレンスドキュメントを含むフォルダです。スキルはnpx skills addでインストールし、該当するタスクが発生するとエージェントによって読み込まれます。

agent-skills は無料で使えますか？ライセンスは？

agent-skills にはライセンスが明記されていません。コードは公開されていますが、ライセンスがない場合は再利用の許諾がないため、利用前に作者に確認することをおすすめします。

agent-skills は今もメンテナンスされていますか？

活発にメンテナンス中。agent-skills の最終コミットは 2026年10月14日 です。

agent-skills は何に使えますか？

ReactまたはNext.jsのコンポーネントをレビューし、レンダリングやバンドルのパフォーマンス上の問題を確認する。 デプロイ済みのVercelプロジェクトを監査し、遅いルートや高額な関数コストを検出する。 サイトのマークアップとスタイルがアクセシビリティガイドラインに沿っているか確認する。 チャットセッションで作成したプロトタイプをデプロイし、共有可能なライブURLを取得する。

agent-skills のインストール方法は？

npxでスキルをインストールします: npx skills add vercel-labs/agent-skills パフォーマンスの問題がないかReactコンポーネントをレビューするなど、スキルに合ったタスクをエージェントに依頼します

agent-skills はどこで入手できますか？

ソースコードとインストール手順は GitHub にあります：https://github.com/vercel-labs/agent-skills