プラグインを追加または更新する

インストール手順とこのプラグインのマークダウンガイドの全てを含む設定プロンプトをコピーする

このガイドでは、Capacitor プラグインをCapgo ウェブサイトに追加したり、既存のプラグインドキュメントを更新したりする方法を説明します。このガイドは、ドキュメントの維持に協力するコントリビューター、メンテナー、AIエージェント向けに便利です。

概要

新しいCapgo プラグインを追加する場合、ウェブサイトのさまざまな場所に複数のファイルを更新する必要があります。これにより、プラグインがすべての関連する場所で正しく表示されるようにします。

プラグインリストの構成 - マスターリストにプラグインメタデータを追加する
プラグインインデックスページ - カテゴリごとに表示されるプラグインの一覧ページにプラグインを追加する
サイドバーナビゲーション - ドキュメントのサイドバーにプラグインを追加する
プラグインドキュメント - オーバービューとスタートガイドのページを作成する
プラグインチュートリアル - 統合的なチュートリアルを作成する

ファイルの場所

重要なファイルを更新する

ファイル	目的
`/src/config/plugins.ts`	マスタープラグインリスト
`/src/content/docs/docs/plugins/index.mdx`	プラグインインデックスページ
`/astro.config.mjs`	サイドバー設定
`/src/content/docs/docs/plugins/[plugin-name]/`	プラグインドキュメントディレクトリ
`/src/content/plugins-tutorials/en/`	英語チュートリアルファイル

ステップバイステップガイド

プラグインをマスターリストに追加

開く /src/config/plugins.ts そして、プラグインを追加してください。 actions 配列:

// First, import an appropriate Heroicon
import YourIconName from 'astro-heroicons/mini/IconName.astro'

// Then add to the actions array
{
  name: '@capgo/your-plugin-name',
  author: 'github.com/Cap-go',
  description: 'Brief description of what the plugin does',
  href: 'https://github.com/Cap-go/your-plugin-name/',
  title: 'Display Name',
  icon: YourIconName,
}

利用可能なアイコン: 利用可能なアイコンを確認してください。 /node_modules/astro-heroicons/mini/ インデックスページにプラグインを追加

「インデックスページにプラグインを追加」というセクション
開く

そして、適切なカテゴリの下にプラグインを追加してください。 /src/content/docs/docs/plugins/index.mdx クリップボードにコピー
```
<LinkCard
  title="Your Plugin Name"
  description="Brief description of what the plugin does"
  href="/docs/plugins/your-plugin-name/"
/>
```
array::
- ⭐ ご紹介されているプラグイン
- 📱 デバイス & システムプラグイン
- 🎥 メディア & カメラプラグイン
- 🛠️ ユーティリティプラグイン
- 🤖 AI & アドバンスドメディア
- 📍 ロケーション & バックグラウンドサービス
- 📞 通信 & アナリティクス
- 🔐 セキュリティ & システム
- 📊 Android固有の機能
- 📥 ダウンロード & ナビゲーション
サイドバーナビゲーションに追加
セクション「サイドバーナビゲーションに追加」

開く /astro.config.mjs そしてサイドバーの設定 (約 540 行目) にプラグインを追加してください。
```
{
  label: 'Your Plugin Name',
  items: [
    { label: 'Overview', link: '/docs/plugins/your-plugin-name/' },
    { label: 'Getting started', link: '/docs/plugins/your-plugin-name/getting-started' },
  ],
  collapsed: true,
}
```
サイドバーで表示されるプラグインはアルファベット順に表示されます。
プラグインドキュメントディレクトリを作成
「プラグインドキュメントディレクトリを作成」セクション

プラグインドキュメント用のディレクトリを作成してください:
ターミナル画面
```
mkdir -p /src/content/docs/docs/plugins/your-plugin-name/
```

プラグイン概要ページを作成

作成 /src/content/docs/docs/plugins/your-plugin-name/index.mdx:

---
title: "@capgo/your-plugin-name"
description: Brief description of the plugin's purpose
tableOfContents: false
next: false
prev: false
sidebar:
  order: 1
  label: "Introduction"
hero:
  tagline: Detailed tagline explaining what the plugin does
  image:
    file: ~public/your-plugin-icon.svg
  actions:
    - text: Get started
      link: /docs/plugins/your-plugin-name/getting-started/
      icon: right-arrow
      variant: primary
    - text: Github
      link: https://github.com/Cap-go/your-plugin-name/
      icon: external
      variant: minimal
---

import { Card, CardGrid } from '@astrojs/starlight/components';

<CardGrid stagger>
  <Card title="Feature 1" icon="puzzle">
    Description of first key feature
  </Card>
  <Card title="Feature 2" icon="rocket">
    Description of second key feature
  </Card>
  <Card title="Cross-platform" icon="puzzle">
    Works on both iOS and Android 📱
  </Card>
  <Card title="Comprehensive Documentation" icon="open-book">
    Check the [Documentation](/docs/plugins/your-plugin-name/getting-started/) to master the plugin.
  </Card>
</CardGrid>

スタートガイドの作成

作成 /src/content/docs/docs/plugins/your-plugin-name/getting-started.mdx:

---
title: Getting Started
description: Learn how to install and use the plugin in your Capacitor app.
sidebar:
  order: 2
---

import { Steps } from '@astrojs/starlight/components';
import { PackageManagers } from 'starlight-package-managers'

<Steps>
1. **Install the package**
   <PackageManagers pkg="@capgo/your-plugin-name" pkgManagers={['npm', 'pnpm', 'yarn', 'bun']} />

2. **Sync with native projects**
   <PackageManagers type="exec" pkg="cap" args="sync" pkgManagers={['npm', 'pnpm', 'yarn', 'bun']} />
</Steps>

## Configuration

### iOS Configuration
[iOS-specific setup instructions]

### Android Configuration
[Android-specific setup instructions]

## Usage

[Basic usage examples]

## API Reference

[Detailed API documentation]

## Complete Example

[Full working example]

## Best Practices

[Recommended practices and tips]

## Platform Notes

[Platform-specific notes and limitations]

チュートリアルファイルの作成

作成 /src/content/plugins-tutorials/en/your-plugin-name.md:

---
locale: en
---
# Using @capgo/your-plugin-name Package

The `@capgo/your-plugin-name` package [brief description]. In this tutorial, we will guide you through the installation, configuration, and usage of this package in your Ionic Capacitor app.

## Installation

[Installation steps]

## Configuration

[Configuration steps for iOS and Android]

## API Usage

[Detailed API usage examples]

## Complete Example

[Full working example]

## Best Practices

[Tips and best practices]

## Troubleshooting

[Common issues and solutions]

## Conclusion

[Summary and links to additional resources]

プラグインドキュメント構造

必要なファイル

src/content/docs/docs/plugins/your-plugin-name/
├── index.mdx           # Overview page with hero and feature cards
└── getting-started.mdx # Installation and usage guide

src/content/plugins-tutorials/en/
└── your-plugin-name.md # Comprehensive tutorial

任意のファイル

複雑なプラグインの場合、追加のドキュメントページを追加できます:

src/content/docs/docs/plugins/your-plugin-name/
├── index.mdx
├── getting-started.mdx
├── api-reference.mdx   # Detailed API documentation
├── examples.mdx        # Additional examples
├── troubleshooting.mdx # Troubleshooting guide
└── migrations.mdx      # Migration guides

コンテンツガイドライン

説明書きを書く

: 説明書きは100文字以内に抑える必要なファイルのセクション
具体に説明してください: プラグインの機能を説明し、プラグイン自体を説明しないでください
動作を使用してください: 「制御」、「統合」、「有効化」などの動詞で始めます

良い例:

「デバイスのフラッシュライトとターチを簡単にオン/オフのスイッチで制御する」
「アプリにクライスライブチャットと顧客サポートを統合する」
「Face IDとTouch IDを使用した安全な認証を有効化する」

悪い例:

「フラッシュ用のプラグイン」
「クライス用のプラグイン」
「バイオメトリック用のプラグイン」

ドキュメントの作成

インストールの開始: 清潔なインストール手順から始める
設定の提供: プラットフォーム固有のセットアップ要件を含める
使用例の表示: 動作する code の例を提供する
API の参照: 全てのメソッドとパラメータをドキュメントする
完全な例の追加: 実世界の使用パターンを示す
List 最良の実践: 最適な使用方法に関するヒントを共有する
プラットフォームの差異をドキュメント化: iOS と Android の動作を明確にする
トラブルシューティングを追加: 共通の問題を解決する

Code の例

code の例では TypeScript を使用する
__CAPGO_KEEP_0__ の例では、トップに import を含める
__CAPGO_KEEP_0__ の例では、重要なステップを説明するコメントを追加する
__CAPGO_KEEP_0__ の例では、エラー処理を表示する
基本的なと高度な使用法の両方を示す

チェックリスト

新しいプラグインを追加する際に使用するチェックリストです。

アイコンリファレンス

プラグインで使用される一般的なアイコン ( astro-heroicons/mini/):

アイコン	用途
`BoltIcon`	コンテキスト:Capgoのソリューションマーケティングページ。役割:短いUIラベルまたはナビゲーションアイテム。ページソリューション/コルダボアイトゥキャパシタートアストロ。メッセージキー`solutions_cordova_to_capacitor_ai_table_use_case` (ソリューションコルダボアイトゥキャパシタートテーブル用途)。
`CameraIcon`	フラッシュ、パワー、エネルギー
`ChatBubbleLeftIcon`	カメラ、写真、ビデオ
`FingerPrintIcon`	チャット、メッセージング、コミュニケーション
`MapPinIcon`	バイオメトリクス、セキュリティ、認証
`SpeakerWaveIcon`	位置、地理情報、地図
`VideoCameraIcon`	オーディオ、サウンド、音楽
`CreditCardIcon`	決済、購入
`PlayCircleIcon`	メディアプレーヤー、動画プレーヤー
`SignalIcon`	接続性、ネットワーク、ビーコン
`RadioIcon`	ビーコン、ブロードキャスト、無線
`ChatBubbleOvalLeftIcon`	SNS、WeChat

既存のプラグインの更新

既存のプラグインを更新する場合

バージョン番号を更新する ドキュメントに記載する
マイグレーションガイドを追加する 破壊的な変更が存在する場合
API の参照を更新してください 新しいメソッドとともに
新しい機能のための例を追加してください 新機能に基づいて
プラットフォームの要件を更新してください 変更があった場合
新機能に基づいてベストプラクティスを改訂してください チュートリアルを最新の __CAPGO_KEEP_0__ と共に
言語パス with latest API

Language Paths

英語でプラグインドキュメントを書き、レビューする。

テスト

プラグインドキュメントを追加または更新した後:

サイトをローカルでビルドする:
ターミナル画面
```
bun run build
```
エラーを確認する:
- すべてのリンクが正常に動作することを確認する
- 画像が正しく表示されることを確認する
- 「code」の例が有効であることを確認する
- ナビゲーションが正常に動作することを確認する
サイトのプレビューを見る:
ターミナルウィンドウ
```
bun run dev
```
プラグインが表示されることを確認する:
- プラグインのリストページを確認する
- サイドバーのナビゲーションを確認する
- すべてのドキュメントページをテストする
- チュートリアルページが正常に動作することを確認する

よくある間違い

ヘルプを求める

プラグインの追加または更新のドキュメントの作成に必要な場合:

Discord: 連絡先 Discord コミュニティ
: GitHub を開くpagePath サイトのリポジトリ
メール: Capgoのマーケティングサイトのページ/エリア。ロール: UIラベル。ページ: page register.astro。メッセージキー `email_label` (メールラベル)。|ページ/エリア:ライブアップデート製品ページ。ロール: UIラベル。メッセージキー `live_update_guidance_email_label` (ライブアップデートガイドメールラベル)。 support@capgo.app

support@__CAPGO_KEEP_0__.app

「例」のセクション

参考として、以下のよくドキュメント化されたプラグインを確認してください: /src/content/docs/docs/plugins/updater/ アップデーター
(複雑なプラグイン、複数のページあり): /src/content/docs/docs/plugins/flash/ フラッシュ
(単純なプラグイン、良好なスターター例として適しています): /src/content/docs/docs/plugins/social-login/ プラグインと子ページ

概要

Capgo ドキュメントにプラグインを追加するには、以下の手順を実行します。

マスターコンフィギュレーションにメタデータを追加する
カテゴリ化されたインデックスページにプラグインを追加する
サイドバーのナビゲーションを設定する
詳細なドキュメントページを作成する
詳細なチュートリアルを書く
すべての変更をローカルでテストする

このガイドを実行することで、プラグインはユーザーが容易に発見できるように、統一されたドキュメントで記述されます。

「プラグインの追加または更新」を続けてください

あなたが「プラグインの追加または更新を続ける」を使用している場合 プラグインの追加または更新を続ける native プラグインの作業計画に使用する場合、 Capgo プラグインディレクトリ Capgo プラグインディレクトリの製品ワークフロー Capacitor Plugins by Capgo for the implementation detail in Capacitor Plugins by Capgo, 製品ワークフローの実装詳細 __CAPGO_KEEP_0__ プラグイン Capgo Native Builds for the product workflow in Capgo Native Builds, and Capacitor プラグイン: 重要な事項 for the practical context in Capacitor Plugins: What You Need to Know.