スタートガイド

インストール

AIアシストによるセットアップを使用してプラグインをインストールできます。次のコマンドを使用して、お使いのAIツールに Capgo のスキルを追加してください：

bunx skills add https://github.com/Cap-go/capgo-skills --skill capacitor-plugins

次に、以下のプロンプトを使用してください：

Use the `capacitor-plugins` skill from `Cap-go/capgo-skills` to install the `@capgo/capacitor-live-reload` plugin in my project.

手動でのセットアップを行う場合は、以下のコマンドを実行してプラグインをインストールし、各プラットフォームごとの手順に従ってください：

bun add @capgo/capacitor-live-reload
bunx cap sync

インポート

import { LiveReload } from '@capgo/capacitor-live-reload';

クイックスタート

import { LiveReload } from '@capgo/capacitor-live-reload';

const result = await LiveReload.configureServer({ url: 'https://example.com' });
console.log(result);

例：connect

import { LiveReload } from '@capgo/capacitor-live-reload';

const result = await LiveReload.connect();
console.log(result);

例：切断

import { LiveReload } from '@capgo/capacitor-live-reload';

const result = await LiveReload.disconnect();
console.log(result);

よくある落とし穴

• リスナー：画面のアンマウント時にハンドルを削除してください。
• Native sync: 実行 bunx cap sync プラグインのアップグレード後。
• 信頼できる情報源: 信頼 src/definitions.ts GitHub リポジトリ内。

API の概要

configureServer

次回の接続で使用するリモート開発サーバーの設定を保存します。

import { LiveReload } from '@capgo/capacitor-live-reload';

const result = await LiveReload.configureServer({ url: 'https://example.com' });
console.log(result);

connect

WebSocket接続が確立されていない場合に、接続を開始します。

import { LiveReload } from '@capgo/capacitor-live-reload';

const result = await LiveReload.connect();
console.log(result);

disconnect

現在のWebSocket接続を閉じ、自動再接続を無効にします。

import { LiveReload } from '@capgo/capacitor-live-reload';

const result = await LiveReload.disconnect();
console.log(result);

getStatus

現在の接続ステータスを返します。

import { LiveReload } from '@capgo/capacitor-live-reload';

const result = await LiveReload.getStatus();
console.log(result);

reload

Capacitor WebView をフルリロードします。

import { LiveReload } from '@capgo/capacitor-live-reload';

await LiveReload.reload();

reloadFile

ランタイムが対応している場合、単一のファイル/モジュールをリロードします（非対応の場合はフルリロードにフォールバックします）。

import { LiveReload } from '@capgo/capacitor-live-reload';

await LiveReload.reloadFile({ path: 'path/to/file' });

型リファレンス

ConfigureServerOptions

export interface ConfigureServerOptions {
  /**
   * Base URL for the dev server (e.g. https://dev.local:5173).
   * When a connection is established the Capacitor WebView navigates to this URL.
   */
  url: string;
  /** Optional WebSocket path override when different from /ws. */
  websocketPath?: string;
  /** Extra headers sent when creating the WebSocket connection. */
  headers?: Record<string, string>;
  /** Automatically reconnect when the socket closes unexpectedly. Default: true. */
  autoReconnect?: boolean;
  /** Delay (ms) between reconnection attempts. Default: 2000. */
  reconnectInterval?: number;
}

LiveReloadStatus

export interface LiveReloadStatus {
  connected: boolean;
  url?: string;
}

FileUpdatePayload

export interface FileUpdatePayload {
  path: string;
  hash?: string;
}

LiveReloadEventCallback

export type LiveReloadEventCallback = (event: LiveReloadEventPayload) => void;

LiveReloadStatusCallback

export type LiveReloadStatusCallback = (status: LiveReloadStatus) => void;

LiveReloadEventPayload

export interface LiveReloadEventPayload {
  type: LiveReloadMessageType;
  /** Populated when type === 'file-update'. */
  file?: FileUpdatePayload;
  /** Optional human-readable message for errors or status changes. */
  message?: string;
}

LiveReloadMessageType

export type LiveReloadMessageType = 'full-reload' | 'file-update' | 'error' | 'connected' | 'disconnected';

Source of Truth

このページはプラグインの src/definitions.tsから生成されています。上流の公開 API が変更された場合は、再度 sync を実行してください。

Getting Startedの続きを進める

使用している場合 スタートガイド ダッシュボードの計画や API 操作を行うには、以下と連携してください： @capgo/capacitor-live-reload を使用する @capgo/capacitor-live-reload を使用した Native Build の機能については、 API の概要 API の概要にある実装の詳細については、 はじめに はじめににある実装の詳細については、 API キー API Keys にある実装の詳細については、 デバイス 実装の詳細については Devices を参照してください。