Skip to content
This repository was archived by the owner on May 19, 2026. It is now read-only.
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
30 changes: 15 additions & 15 deletions jp/components/ai/maker-framework.md
Original file line number Diff line number Diff line change
Expand Up @@ -68,23 +68,23 @@ Copilot Chat をエージェント モードに切り替え、ツール リス
### Claude Desktop

1. Claude Desktop の設定ファイルを開きます:
- macOS: `~/Library/Application Support/Claude/claude_desktop_config.json`
- Windows: `%APPDATA%\Claude\claude_desktop_config.json`
- macOS: `~/Library/Application Support/Claude/claude_desktop_config.json`
- Windows: `%APPDATA%\Claude\claude_desktop_config.json`
2. `mcpServers` ブロックに `maker` エントリを追加します:

```json
{
"mcpServers": {
"maker": {
"command": "npx",
"args": ["-y", "@igniteui/maker-mcp", "--stdio"],
"env": {
"Executor__AIProviderKeys__Anthropic": "<your-anthropic-key>"
}
}
}
}
```
```json
{
"mcpServers": {
"maker": {
"command": "npx",
"args": ["-y", "@igniteui/maker-mcp", "--stdio"],
"env": {
"Executor__AIProviderKeys__Anthropic": "<your-anthropic-key>"
}
}
}
}
```

3. Claude Desktop を再起動します。初回起動時にネイティブ バイナリがダウンロードされます (通常の接続で約 30 秒)。

Expand Down
127 changes: 122 additions & 5 deletions jp/components/general/cli/getting-started-with-angular-schematics.md
Original file line number Diff line number Diff line change
Expand Up @@ -178,21 +178,138 @@ ng g @igniteui/angular-schematics:start

## AI アシスタント統合

Ignite UI for Angular Schematics コレクションには、Ignite UI for Angular Agent Skills と Ignite UI MCP サーバーをプロジェクトに一括設定する `ai-config` schematic が含まれています。Ignite UI for Angular パッケージをインストールした後、プロジェクト ルートから以下のコマンドを実行してください。
Ignite UI for Angular Schematics コレクションには、プロジェクトの AI コーディング アシスタント統合をセットアップする `ai-config` schematic が含まれています。1 つのコマンドで以下を実行します:

- **MCP サーバーの設定** - 選択したコーディング アシスタント用の MCP 設定ファイルに、Ignite UI と Angular CLI MCP サーバー エントリを書き込みます
- **スキル ファイルのコピー** - Angular 固有のスキル ガイドをエージェント ディレクトリに追加します
- **インストラクション ファイルのセットアップ** - 各エージェントのインストラクション ファイルにプロジェクト固有のガイダンスを設定します

Ignite UI for Angular パッケージをインストールした後、プロジェクト ルートから以下のコマンドを実行してください:

```cmd
ng generate @igniteui/angular-schematics:ai-config
```

これにより、Ignite UI for Angular Agent Skills が `.claude/skills/` にコピーされ、`@angular/cli`、`igniteui mcp`、`igniteui-theming-mcp` の 3 つの MCP サーバー エントリが `.vscode/mcp.json` に書き込まれます。ファイルが既に存在していて最新の状態であれば、コマンドは何も行いません。
### フラグ リファレンス

| フラグ | 値 | デフォルト |
|------|--------|---------|
| `--assistants` | `generic`, `vscode`, `cursor`, `gemini`, `junie`, `none` | 対話形式でプロンプト; 非対話形式モードでは `generic` |
| `--agents` | `generic`, `claude`, `copilot`, `cursor`, `codex`, `windsurf`, `gemini`, `junie`, `none` | 対話形式でプロンプト; 非対話形式モードでは `generic` + `claude` |

### サポートされているコーディング アシスタント

| コーディング アシスタント | 選択値 | 設定ファイル パス | ルート キー |
|-----------------|--------------|-------------|----------|
| Generic (Claude Code、VS Code など) | `generic` | `.mcp.json` | `mcpServers` |
| VS Code (GitHub Copilot) | `vscode` | `.vscode/mcp.json` | `servers` |
| Cursor | `cursor` | `.cursor/mcp.json` | `mcpServers` |
| Gemini | `gemini` | `.gemini/settings.json` | `mcpServers` |
| JetBrains Junie | `junie` | `.junie/mcp/mcp.json` | `mcpServers` |

### サポートされている AI エージェント

| エージェント | スキル ディレクトリ | インストラクション ファイル |
|-------|------------------|------------------|
| Generic | `.agents/skills` | `AGENTS.md` |
| Claude | `.claude/skills` | `.claude/CLAUDE.md` |
| Copilot | `.github/skills` | `.github/copilot-instructions.md` |
| Cursor | `.cursor/skills` | `.cursor/rules/cursor.mdc` |
| Codex | `.codex/skills` | `.codex/instructions.md` |
| Windsurf | `.windsurf/skills` | `.windsurf/rules/guidelines.md` |
| Gemini | `.gemini/skills` | `.gemini/GEMINI.md` |
| Junie | `.junie/skills` | `.junie/guidelines.md` |

### 使用例

対話形式 - コーディング アシスタント、エージェントの順でプロンプトが表示されます:

```bash
ng generate @igniteui/angular-schematics:ai-config
```

非対話形式 - アシスタントとエージェントの両方を指定します:

```bash
ng generate @igniteui/angular-schematics:ai-config --assistants cursor --agents claude copilot
```

MCP 設定のみをスキップします:

```bash
ng generate @igniteui/angular-schematics:ai-config --assistants none --agents claude generic
```

スキル ファイルとインストラクションのみをスキップします (MCP サーバーは引き続き設定されます):

```bash
ng generate @igniteui/angular-schematics:ai-config --assistants vscode --agents none
```

schematic は `ng add igniteui-angular` の一部として自動的に実行され、デフォルト値はエージェントに `["claude", "generic"]`、アシスタントに `["generic"]` が使用されます。

### MCP サーバー設定

schematic は、選択したコーディング アシスタントの設定ファイルに書き込みます (または既存のファイルにマージします)。既存のサードパーティ MCP サーバー エントリは常に保持されます - コマンドはマージするのみで、上書きしません。Angular schematic 経由で実行すると、Ignite UI サーバーと並んで追加の `angular-cli` MCP サーバー エントリが自動的に含まれます。

**Generic、Cursor、Gemini、Junie** (`.mcp.json` および同等のファイル、ルート キー `mcpServers`):

```json
{
"mcpServers": {
"angular-cli": {
"command": "npx",
"args": ["-y", "@angular/cli", "mcp"]
},
"igniteui-cli": {
"command": "npx",
"args": ["-y", "igniteui-cli", "mcp"]
},
"igniteui-theming": {
"command": "npx",
"args": ["-y", "igniteui-theming", "igniteui-theming-mcp"]
}
}
}
```

**VS Code / GitHub Copilot** (`.vscode/mcp.json`、ルート キー `servers`):

```json
{
"servers": {
"angular-cli": {
"command": "npx",
"args": ["-y", "@angular/cli", "mcp"]
},
"igniteui-cli": {
"command": "npx",
"args": ["-y", "igniteui-cli", "mcp"]
},
"igniteui-theming": {
"command": "npx",
"args": ["-y", "igniteui-theming", "igniteui-theming-mcp"]
}
}
}
```

### スキル ファイル

スキル ファイルは、各エージェントのスキル ディレクトリにコピーされる Angular 固有のガイドです。インストール済みの Ignite UI パッケージから取得され、schematic を実行するたびに同期されます - 既存のファイルはコンテンツが変更された場合にのみ更新されます。

> [!NOTE]
> パッケージをインストールする前 (例: `--skip-install` を使用した場合) に `ai-config` を実行すると、schematic は組み込みテンプレートにフォールバックします。インストール済みバージョンのスキル ファイルを取得するには、インストール後にコマンドを再実行してください。

### Ignite UI CLI の使用

Ignite UI CLI がグローバルにインストールされている場合、同等のコマンドは次のとおりです
Ignite UI CLI がグローバルにインストールされている場合、同等のコマンドは次のとおりです:

```cmd
ig ai-config
```

> [!NOTE]
> `ig ai-config` コマンドは `igniteui mcp` と `igniteui-theming-mcp` の 2 つの Ignite UI エントリのみを設定し、`@angular/cli` は登録しません。3 つのサーバーをすべて一括設定するには `ng generate @igniteui/angular-schematics:ai-config` を使用してください。
> `ig ai-config` コマンドは `igniteui-cli` と `igniteui-theming` の 2 つの Ignite UI エントリのみを設定し、`angular-cli` は登録しません。1 つのステップですべての 3 つのサーバーを設定するには `ng generate @igniteui/angular-schematics:ai-config` を使用してください。

すべての AI クライアントおよび Agent Skills の設定手順の詳細については、[Ignite UI CLI MCP](../../ai/cli-mcp.md) を参照してください。
すべての AI クライアントおよび Agent Skills の配線に関する詳細なセットアップ手順については、[Ignite UI CLI MCP](../../ai/cli-mcp.md) を参照してください。
42 changes: 39 additions & 3 deletions jp/components/general/cli/getting-started-with-cli.md
Original file line number Diff line number Diff line change
Expand Up @@ -55,6 +55,24 @@ ig new
ig new newAngularProject --framework=angular --type=igx-ts --template=side-nav
```

プロジェクト作成時に AI アシスタントとエージェントの設定を指定することもできます:

```cmd
ig new my-app --framework=angular --type=igx-ts --template=side-nav --assistants generic --agents claude copilot
```

AI 設定を完全にスキップするには:

```cmd
ig new my-app --framework=angular --type=igx-ts --assistants none --agents none
```

**`ig new` の実行順序:**
1. プロジェクト ファイルが生成されます
2. AI 設定が新しいプロジェクト ディレクトリ内で実行されます (フラグが指定されていない場合はアシスタントとエージェントのプロンプトが表示されます)
3. Git が初期化されます (`--skip-git` を指定した場合を除く)
4. 依存関係がインストールされます (`--skip-install` を指定した場合を除く)

>[!NOTE]
> `v13.1.0` 以降、`igx-ts` プロジェクト タイプはデフォルトでスタンドアロン コンポーネントを使用するプロジェクトを生成します。代わりにモジュールベースのブートストラップを使用したい場合は、`type` を `igx-ts-legacy` に設定できます。

Expand Down Expand Up @@ -188,13 +206,31 @@ ig start

Ignite UI CLI には、AI コーディング アシスタント (GitHub Copilot、Claude、Cursor など) を最新の Ignite UI コンポーネント ドキュメントおよび API リファレンスに接続する組み込みの MCP (Model Context Protocol) サーバーが含まれています。設定後、AI アシスタントはコンポーネント API を照会したり、セットアップ ガイドを取得したり、コンテキストを切り替えずに正確な Ignite UI for Angular コードを生成したりできます。

`ig new` でプロジェクトを作成した場合、スキャフォールディング時に VS Code MCP 設定が `.vscode/mcp.json` に生成され、Ignite UI for Angular Agent Skills が `.claude/skills/` にコピーされます。これらのファイルのいずれかまたは両方が欠けている既存のプロジェクトで作業している場合は、プロジェクト ルートから `ig ai-config` を実行して MCP 設定とスキルを一括セットアップしてください。
`ig new` でプロジェクトを作成した場合、スキャフォールディング時に MCP 設定と Agent Skills がすでに生成されています。既存のプロジェクトで作業している場合は、プロジェクト ルートから `ig ai-config` を実行して MCP サーバー、スキル ファイル、インストラクション ファイルを一括セットアップしてください:

```cmd
ig ai-config
```

AI クライアントを手動で設定する場合、または VS Code 以外のクライアントを使用する場合は、以下のコマンドで MCP サーバーを直接起動してください。
コマンドは複数のコーディング アシスタントと AI エージェントをサポートしています:

```cmd
ig ai-config --assistants generic vscode --agents claude copilot
```

| フラグ | 値 | デフォルト |
|------|--------|---------|
| `--assistants` | `generic`, `vscode`, `cursor`, `gemini`, `junie`, `none` | 対話形式でプロンプト; 非対話形式モードでは `generic` |
| `--agents` | `generic`, `claude`, `copilot`, `cursor`, `codex`, `windsurf`, `gemini`, `junie`, `none` | 対話形式でプロンプト; 非対話形式モードでは `generic` + `claude` |

フラグなしで実行すると、`ig ai-config` は対話形式モードになり、スペースでトグル、ENTER で確認してコーディング アシスタントとエージェントを選択するよう促します。プロンプトは `ig new` 時のウィザード ステップを反映しています:

1. **コーディング アシスタントの選択** - MCP サーバー設定の対象として 1 つ以上を選択します (Generic、VS Code、Cursor、Gemini、Junie)、またはスキップするには None を選択します。
2. **AI エージェントの選択** - スキル ファイルとインストラクション ファイル用に 1 つ以上のエージェントを選択します (Generic、Claude、Copilot、Cursor、Codex、Windsurf、Gemini、Junie)、またはスキップするには None を選択します。

対話形式モードのデフォルトはアシスタントに **Generic**、エージェントに **Generic + Claude** です。ウィザード プロンプトの詳細については、[Ignite UI CLI を使用したステップ バイ ステップ ガイド - AI アシスタントの設定](step-by-step-guide-using-cli.md#configure-ai-assistants)を参照してください。

AI クライアントを手動で設定する場合、または VS Code 以外のクライアントを使用する場合は、以下のコマンドで MCP サーバーを直接起動してください:

```cmd
ig mcp
Expand All @@ -218,4 +254,4 @@ ig mcp
| [ig test](https://github.com/IgniteUI/igniteui-cli/wiki/test) | | 現在のプロジェクトのテストを実行します。
| ig version | -v | ローカル (ローカルがない場合はグローバル) にインストールされた Ignite UI CLI バージョンを示します。 |
| ig mcp | | Ignite UI MCP サーバーを起動し、接続された AI アシスタントにコンポーネント ドキュメント検索および API リファレンス ツールを提供します。[Ignite UI CLI MCP](../../ai/cli-mcp.md) を参照してください。 |
| ig ai-config | | `.claude/skills/` に Ignite UI for Angular Agent Skills をコピーし、`.vscode/mcp.json` に Ignite UI MCP サーバー設定を書き込むことで、既存のプロジェクトの AI 統合をセットアップします。 |
| ig ai-config | | AI コーディング アシスタント統合をセットアップします - 選択したアシスタントとエージェント用に MCP サーバーを設定し、スキル ファイルをコピーし、インストラクション ファイルを設定します。 |
Loading
Loading