> For the complete documentation index, see [llms.txt](https://docs.avonnicomponents.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.avonnicomponents.com/experience-cloud/experience-cloud-ja/aide/setup.md).

# セットアップ

Avonni Skills をインストールし、Avonni MCP サーバーを AI アシスタントに接続します。

{% hint style="warning" %}
🚧 **早期アクセス。** Build with AI は段階的に展開され、リリースごとに改善されています。わかりにくい点、足りない点、壊れている点はありますか？ [お知らせください](/experience-cloud/experience-cloud-ja/herupu/how-do-i-contact-support.md): あなたのフィードバックが、次に改善する内容を直接形作ります。
{% endhint %}

接続するものは2つあります:  **Avonni Skills** と **Avonni MCPサーバー**。まず必要条件をそろえ、その後でクライアントを選んでください。

## 要件

スキルはお使いのマシンにファイルを書き込み、Salesforce組織に対して動作するため、Claudeデスクトップアプリを含むすべてのクライアントには同じ基盤が必要です:

* [**Node.js**](https://nodejs.org/en/download) **18以上。** スキルはローカルスクリプトを実行します。Node.js がなければ、まったく実行できません。
* [**Salesforce CLI**](https://developer.salesforce.com/docs/atlas.en-us.sfdx_setup.meta/sfdx_setup/sfdx_setup_install_cli.htm)**、お使いの組織に認証済みであること。** これが組織対応の手順（オブジェクトとフィールドのドキュメント検索、コンポーネントバージョンの照会、サイトコンテンツの取得と保存）を支え、アシスタントが生成したものをデプロイする方法でもあります。組織を接続するには、次を実行します:

```bash
sf org login web
```

{% hint style="warning" %}
**まずこれを行ってください。** Node.js と認証済みの Salesforce CLI がなければ、スキルも MCP サーバーも扱う対象がありません。アシスタントはドキュメントを読むことはできますが、お使いの組織で使えるものを生成したり保存したりはできません。
{% endhint %}

## クライアントを選択してください

{% tabs %}
{% tab title="🖥️ Claude Code（デスクトップアプリまたはターミナル）" %}
**1. スキルをインストールする**

プロジェクト ディレクトリから（デスクトップアプリでは、先にプロジェクトフォルダを開いてから）、次を実行します:

```bash
npx skills add avonni/skills
```

これにより、5つのスキルすべてがプロジェクトの設定に自動的にダウンロード・インストールされます。

**2. MCPサーバーを接続する**

サーバーはホスト済みです。ローカルにインストールしたり実行したりするものはありません。次を実行します:

```bash
claude mcp add --transport http avonni https://mcp.avonnicomponents.com
```

設定はこれで完了です。
{% endtab %}

{% tab title="⌨️ Cursor、VS Code、GitHub Copilot" %}
**1. スキルをインストールする**

プロジェクト ディレクトリから、次を実行します:

```bash
npx skills add avonni/skills
```

これにより、5つのスキルすべてがプロジェクトの設定に自動的にダウンロード・インストールされます。

**2. MCPサーバーを接続する**

JSON設定エントリを追加します。たとえば、 `.cursor/mcp.json` または `.vscode/mcp.json`:

```json
{
    "mcpServers": {
        "avonni": {
            "url": "https://mcp.avonnicomponents.com"
        }
    }
}
```

正確なファイル名と配置場所は、お使いのアシスタントのドキュメントで確認してください。エントリの形式はどこでも同じで、名前と URL です。
{% endtab %}
{% endtabs %}

## スキルセットの内容

5つのスキルはすべて公開 [avonni/skills](https://github.com/avonni/skills) リポジトリにあります:

* `avonni-experience-components`、Experience Siteページ上の Avonni コンポーネント用
* `avonni-architect`、完全なユースケースを計画して構築するコーディネーター
* `avonni-flow-components`、画面フロー内の Avonni Flow Screen Components 用
* `avonni-dynamic-components`、Lightningページ上の Dynamic Components 用
* `avonni-lwc-components`、LWCコード内の Avonni コンポーネント用

{% hint style="success" %}

#### **セットには avonni-architect を含めておいてください**

ビジネス成果（「ケース一覧とケース作成用フローを備えたサポートポータルページ」など）を説明すると、アーキテクトがアーキテクチャを設計し、依存関係の順序に従って適切なスキルを実行するので、すべての要素が互いに正しく接続されます。これを行うには、ほかのスキルも一緒にインストールされている必要があります。
{% endhint %}

## 設定を確認する

アシスタントに次のように尋ねてください: *「利用可能な Avonni experience コンポーネントを一覧表示してください。」*

MCP サーバー経由で取得した実際のコンポーネント一覧を返し、記憶に基づく一般的な回答でないなら、接続は正常です。

## ツールセットを絞り込む（任意）

既定では、サーバーは4つすべての Avonni パッケージ（`LWC`, `Dynamic`, `Flow`, `Experience`）のツールを公開します。Experience Siteページだけを作成する場合は、次をURLに追加します。 `?toolsets=` クエリパラメータをURLに追加して、アシスタントのツール一覧を最小限に保ちます:

```
https://mcp.avonnicomponents.com?toolsets=experience
```

パッケージを再度追加するには、カンマ区切りの一覧を使用します。たとえば `?toolsets=experience,flow`.

{% hint style="info" %}
ツールセットを絞り込むと、除外したパッケージのコンポーネントはアシスタントから見えなくなります。参照: [制限事項とFAQ](/experience-cloud/experience-cloud-ja/aide/limitations-and-faq.md).
{% endhint %}


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://docs.avonnicomponents.com/experience-cloud/experience-cloud-ja/aide/setup.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.