スタートガイド
インストール手順と、このプラグインの完全なMarkdownガイドを含むセットアッププロンプトをコピーします。
Set up this Capacitor plugin in the project.
Use the package manager already used by the project.
Install these package(s): `@capgo/capacitor-webview-version-checker`
Run the required Capacitor sync/update step after installation.
Read this markdown guide for the full setup steps: https://raw.githubusercontent.com/Cap-go/website/refs/heads/main/apps/docs/src/content/docs/docs/plugins/webview-version-checker/getting-started.mdx
Use that guide for platform-specific steps, native file edits, permissions, config changes, imports, and usage setup.
If that guide references other docs pages, read them too.
インストール
「インストール」セクション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-webview-version-checker` plugin in my project.手動セットアップを希望する場合は、以下のコマンドを実行してプラグインをインストールし、下記のプラットフォーム別の手順に従ってください:
-
パッケージをインストール
ターミナル bun add @capgo/capacitor-webview-version-checker -
ネイティブプロジェクトを同期
ターミナル bunx cap sync -
任意: プラグイン設定を追加 デフォルト値で実行できます (
WebviewVersionChecker: {}) または、プロンプトと閾値の動作を以下でカスタマイズできますcapacitor.config.ts.
クイックスタート
「クイックスタート」セクションimport { WebviewVersionChecker } from '@capgo/capacitor-webview-version-checker';
const result = await WebviewVersionChecker.check();console.log(result);例: startMonitoring
「例: startMonitoring」というセクションimport { WebviewVersionChecker } from '@capgo/capacitor-webview-version-checker';
const result = await WebviewVersionChecker.startMonitoring();console.log(result);例: stopMonitoring
「例: stopMonitoring」というセクションimport { WebviewVersionChecker } from '@capgo/capacitor-webview-version-checker';
const result = await WebviewVersionChecker.stopMonitoring();console.log(result);よくある落とし穴
「よくある落とし穴」セクション- リスナー: 画面がアンマウントされたらハンドルを削除します。
- ネイティブ同期: 実行
bunx cap syncプラグインのアップグレード後。 - 信頼できる情報源: 信頼
src/definitions.tsGitHub リポジトリ内。
デフォルトの動作(主なユースケース)
「デフォルトの動作(主なユースケース)」というセクションデフォルトでは、このプラグインはBrowserslist形式の互換性ルールを使用します:
minimumDeviceSharePercentデフォルトでは3- 共有データセットは、ビルド時に caniuse データからバンドルされます
- デフォルトのフローでは、ランタイムでのデータセット URL 呼び出しは不要です
import type { CapacitorConfig } from '@capacitor/cli';
const config: CapacitorConfig = { plugins: { WebviewVersionChecker: {}, },};
export default config;設定だけで簡単にセットアップ(ネイティブプロンプトを表示)
セクション「シンプルな設定のみでセットアップ(ネイティブプロンプトを表示)」import type { CapacitorConfig } from '@capacitor/cli';
const config: CapacitorConfig = { plugins: { WebviewVersionChecker: { autoPromptOnOutdated: true, }, },};
export default config;高度なしきい値モード(カスタムデータセット)
セクション「高度なしきい値モード(カスタムデータセット)」import type { CapacitorConfig } from '@capacitor/cli';
const config: CapacitorConfig = { plugins: { WebviewVersionChecker: { minimumDeviceSharePercent: 3, versionShareByMajor: { '137': 58.2, '136': 21.3, '135': 4.6, '134': 2.1, }, autoPromptOnOutdated: true, }, },};
export default config;固定バージョンだけでなく、実際のシェアに基づく互換性を判断したい場合のみ使用してください。
minimumDeviceSharePercent: 3インストール済みのメジャーバージョンが、データセットの少なくとも3%を占めることを意味します。versionShareByMajorカスタムマップです: メジャーバージョン => パーセンテージ。- リモートデータを使う場合は、
versionShareApiUrlのいずれかと組み合わせてください:{ "versionShareByMajor": { "137": 54.2, "136": 23.8 } }{ "shareByMajor": { "137": 54.2, "136": 23.8 } }{ "versions": [{ "major": 137, "share": 54.2 }, { "version": "136.0.0.0", "percent": 23.8 }] }
JavaScriptでの高度な使い方
セクション「JavaScriptでの高度な使い方」import { WebviewVersionChecker } from '@capgo/capacitor-webview-version-checker';
await WebviewVersionChecker.addListener('webViewOutdated', (status) => { console.log('Outdated WebView detected', status);});
await WebviewVersionChecker.check({ minimumMajorVersion: 124, showPromptOnOutdated: true,});Capacitor の設定だけでなく、このプラグインを使う理由
セクション「Capacitor の設定だけでなく、このプラグインを使う理由」Capacitor は静的な最小バージョンチェックに対応しています:
android: { minWebViewVersion: 124,},server: { errorPath: 'unsupported-webview.html',}このプラグインはランタイムイベントとネイティブのプロンプトUXを追加するので、ユーザーは更新を促されながらもアプリを開いて使い続けられます。
評価順序:
- デバイス共有しきい値モード (
minimumDeviceSharePercent+ dataset)、指定された場合 - 最新バージョンモード (
latestVersion/latestVersionApiUrl) - 最小メジャーフォールバック (
minimumMajorVersion)
Android プロバイダーの処理
セクション「Android プロバイダー処理」このプラグインは、Android 上で Capacitor が使用する両方の WebView プロバイダーモデルをサポートしています:
- Android 5-6 および 10 以上: Android システム WebView (
com.google.android.webview) - Android 7〜9: Google Chrome (
com.android.chrome)
Getting Startedの続きを進める
「Getting Started からの続き」セクション使用している場合 スタートガイド ネイティブメディアとインターフェースの挙動を計画するには、次と連携させてください @capgo/capacitor-webview-version-checker の使い方 『Using @capgo/capacitor-webview-version-checker』のネイティブ機能については、 @capgo/capacitor-live-activities の使用 @capgo/capacitor-live-activities の使用におけるネイティブ機能については、 @capgo/capacitor-live-activities @capgo/capacitor-live-activities の実装の詳細については、 @capgo/capacitor-video-playerの使用方法 @capgo/capacitor-video-player を使用する際のネイティブ機能については、 @capgo/capacitor-video-player @capgo/capacitor-video-player. の実装の詳細については