Prise en main
Copiez un prompt de configuration incluant les étapes d'installation et le guide markdown complet pour ce plugin.
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.
Installation
Section intitulée « Installation »Vous pouvez utiliser notre configuration assistée par IA pour installer le plugin. Ajoutez les skills Capgo à votre outil d'IA avec la commande suivante :
bunx skills add https://github.com/Cap-go/capgo-skills --skill capacitor-pluginsUtilisez ensuite le prompt suivant :
Use the `capacitor-plugins` skill from `Cap-go/capgo-skills` to install the `@capgo/capacitor-webview-version-checker` plugin in my project.Si vous préférez une installation manuelle, installez le plugin en exécutant les commandes suivantes et suivez les instructions spécifiques à chaque plateforme ci-dessous :
-
Installer le package
Fenêtre de terminal bun add @capgo/capacitor-webview-version-checker -
Synchroniser les projets natifs
Fenêtre de terminal bunx cap sync -
Facultatif : ajouter la config du plugin Vous pouvez exécuter avec les valeurs par défaut (
WebviewVersionChecker: {}) ou personnalisez le comportement du prompt et du seuil danscapacitor.config.ts.
Démarrage rapide
Section intitulée « Démarrage rapide »import { WebviewVersionChecker } from '@capgo/capacitor-webview-version-checker';
const result = await WebviewVersionChecker.check();console.log(result);Exemple : startMonitoring
Section intitulée « Example: startMonitoring »import { WebviewVersionChecker } from '@capgo/capacitor-webview-version-checker';
const result = await WebviewVersionChecker.startMonitoring();console.log(result);Exemple : stopMonitoring
Section intitulée « Exemple : stopMonitoring »import { WebviewVersionChecker } from '@capgo/capacitor-webview-version-checker';
const result = await WebviewVersionChecker.stopMonitoring();console.log(result);Erreurs courantes
Section intitulée « Erreurs courantes »- Écouteurs: supprimez les handles lors du démontage des écrans.
- Sync native : exécuter
bunx cap syncaprès les mises à jour du plugin. - Source de vérité : fiez-vous
src/definitions.tsau repo GitHub.
Comportement par défaut (cas d’usage principal)
Section intitulée « Comportement par défaut (cas d’usage principal) »Par défaut, ce plugin utilise une règle de compatibilité de type Browserslist :
minimumDeviceSharePercentpar défaut sur3- le jeu de données de partage est inclus au moment du build à partir des données caniuse
- Aucun appel d’URL de dataset au runtime n’est nécessaire pour le flux par défaut
import type { CapacitorConfig } from '@capacitor/cli';
const config: CapacitorConfig = { plugins: { WebviewVersionChecker: {}, },};
export default config;Configuration seule (afficher le prompt natif)
Section intitulée « Configuration simple sans code (afficher le prompt natif) »import type { CapacitorConfig } from '@capacitor/cli';
const config: CapacitorConfig = { plugins: { WebviewVersionChecker: { autoPromptOnOutdated: true, }, },};
export default config;Mode seuil avancé (jeu de données personnalisé)
Section intitulée « Mode seuil avancé (jeu de données personnalisé) »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;Utilisez ceci uniquement si vous souhaitez une compatibilité basée sur la part réelle d’utilisation plutôt que sur une version fixe.
minimumDeviceSharePercent: 3signifie que la version majeure installée doit représenter au moins 3 % de votre jeu de données.versionShareByMajorest votre mapping personnalisé : version majeure => pourcentage.- Si vous préférez les données distantes, utilisez
versionShareApiUrlavec l'un de ces choix :{ "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 }] }
Usage avancé avec JavaScript
Section intitulée « Usage avancé avec 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,});Pourquoi utiliser ce plugin plutôt qu'une simple config Capacitor
Section intitulée « Pourquoi utiliser ce plugin plutôt qu'une simple config Capacitor »Capacitor supports static minimum checks:
android: { minWebViewVersion: 124,},server: { errorPath: 'unsupported-webview.html',}Ce plugin ajoute des événements runtime et une UX de prompt native, pour que les utilisateurs puissent ouvrir et utiliser l'app tout en étant incités à mettre à jour.
Ordre d'évaluation :
- Mode seuil de partage d'appareils (
minimumDeviceSharePercent+ dataset), si fourni - Mode dernière version (
latestVersion/latestVersionApiUrl) - Repli sur la version majeure minimale (
minimumMajorVersion)
Gestion du provider Android
Section intitulée « Gestion du fournisseur Android »Le plugin prend en charge les deux modèles de fournisseur WebView utilisés par Capacitor sur Android :
- Android 5-6 et 10+ : Android System WebView (
com.google.android.webview) - Android 7-9 : Google Chrome (
com.android.chrome)
Continuer depuis Getting Started
Section intitulée « Continuer après Prise en main »Si vous utilisez Prise en main pour planifier le comportement des médias et de l'interface natifs, connectez-l’à Utiliser @capgo/capacitor-webview-version-checker pour la capacité native dans Utiliser @capgo/capacitor-webview-version-checker Utiliser @capgo/capacitor-live-activities pour la capacité native dans Utiliser @capgo/capacitor-live-activities @capgo/capacitor-live-activities pour le détail d'implémentation dans @capgo/capacitor-live-activities Utiliser @capgo/capacitor-video-player pour la capacité native dans Utiliser @capgo/capacitor-video-player, et @capgo/capacitor-video-player pour le détail d'implémentation dans @capgo/capacitor-video-player.