@poups/nuxt3-capacitor v1.5.3
📱 @poups/nuxt3-capacitor
🇺🇸 English
An interactive npm package to configure Capacitor with Android and/or iOS for Nuxt/SPA projects.
Script with modern colored interface and interactive platform selection.
✨ Features
- 🎯 Single command with interactive platform selection
- 🧹 Smart cleanup : targeted deletion per platform
- 🔄 Auto-detection : checks for existing installations
- ⚙️ Automated configuration : generates
capacitor.config.ts - 🔨 Auto build & sync :
npm run generate+npx cap sync - 🎨 Modern interface : colored display with emojis and banners
- 📱 Cross-platform : supports Android and/or iOS
📦 Installation
Global installation (recommended)
npm install -g @poups/nuxt3-capacitorThen use the command directly:
capacitor-setupLocal installation
# In your project
npm install --save-dev @poups/nuxt3-capacitor
# Then use with npx
npx capacitor-setup🚀 Usage
capacitor-setup - Interactive Configuration
Main script to configure your mobile platforms with interactive selection:
capacitor-setupThe script will let you choose:
- 📱 Android only
- 🍎 iOS only
- 🚀 Android + iOS (complete cross-platform)
Advanced features:
- Manage existing installations
- Targeted cleanup options per platform
- Interactive app configuration (name + bundle ID)
- Detection and preservation of existing platforms
🔍 Diagnostic système
Vérifiez votre environnement de développement avant la configuration :
capacitor-setup --diagnostic
# ou
capacitor-setup --check
# ou
capacitor-setup -dLe diagnostic vérifiera :
- Environnement général : Node.js, npm, Git
- Développement Android : Java/JDK, Android SDK, ADB, Android Studio
- Développement iOS : Xcode, simulateurs iOS (macOS uniquement)
- Capacitor : Packages du projet et configuration
📋 What the script does
- 🔍 Detection : Checks existing Capacitor installations
- 🧹 Cleanup : Targeted deletion options per platform
- 📱 Selection : Interactive choice of platforms (Android/iOS/both)
- 📝 Configuration : Interactive input for app name and bundle ID
- 📦 Installation :
npm installCapacitor dependencies - ⚙️ Config : Generate/update
capacitor.config.ts - 🚀 Platforms :
npx cap add android/iosbased on selection - 🔨 Build :
npm run generateto create.output/public - 🔄 Sync :
npx cap syncto synchronize with platforms - ✅ Finalization : Display launch commands
📁 Generated structure
your-project/
├── android/ # Android Studio project (if selected)
├── ios/ # Xcode project (if selected)
├── capacitor.config.ts # Capacitor configuration
├── .output/public/ # Your SPA build
└── node_modules/ # Capacitor dependencies🎨 Interface
The script displays a colored interface with:
- 🎯 Stylized ASCII banners
- 📱🍎 Emojis for each platform
- 🔥 Color codes for actions (green=success, red=error, etc.)
- 📋 Interactive numbered menus
- ✅ Real-time feedback
🔧 Generated configuration
The script automatically creates an optimized capacitor.config.ts:
import type { CapacitorConfig } from '@capacitor/cli';
const config: CapacitorConfig = {
appId: 'com.your-app.mobile',
appName: 'Your App',
webDir: '.output/public',
server: {
androidScheme: 'https',
iosScheme: 'ionic'
},
android: {
allowMixedContent: true
},
ios: {
allowsLinkPreview: false
}
};
export default config;🚨 Error handling
The script includes a robust error handling system:
- 🧹 Automatic cleanup on failure
- 📊 Tracking of created resources
- 🔄 Restoration to initial state if needed
- 💬 Explicit error messages in multiple languages
📄 License
MIT
👨💻 Author
Sebastien Poupineau
💡 Tips:
- The script offers targeted cleanup options (Android only, iOS only, or both)
- Keep Android Studio and Xcode closed during installation
- The script automatically preserves non-selected platforms during updates
🇫🇷 Français
Un package npm interactif pour configurer Capacitor avec Android et/ou iOS pour projets Nuxt/SPA.
Script avec interface colorée moderne et sélection interactive des plateformes.
✨ Fonctionnalités
- 🎯 Une commande unique avec sélection interactive des plateformes
- 🧹 Nettoyage intelligent : suppression ciblée par plateforme
- 🔄 Détection automatique : vérification des installations existantes
- ⚙️ Configuration automatisée : génération de
capacitor.config.ts - 🔨 Build & sync automatique :
npm run generate+npx cap sync - 🎨 Interface moderne : affichage coloré avec émojis et bannières
- 📱 Cross-platform : support Android et/ou iOS
📦 Installation
Installation globale (recommandée)
npm install -g @poups/nuxt3-capacitorPuis utilisez la commande directement :
capacitor-setupInstallation locale
# Dans votre projet
npm install --save-dev @poups/nuxt3-capacitor
# Puis utilisez avec npx
npx capacitor-setup🚀 Utilisation
capacitor-setup - Configuration interactive
Script principal pour configurer vos plateformes mobiles avec sélection interactive :
capacitor-setupLe script vous permettra de choisir :
- 📱 Android uniquement
- 🍎 iOS uniquement
- 🚀 Android + iOS (cross-platform complet)
Fonctionnalités avancées :
- Gestion des installations existantes
- Options de nettoyage ciblé par plateforme
- Configuration interactive de l'app (nom + bundle ID)
- Détection et préservation des plateformes existantes
🔍 Diagnostic système
Vérifiez votre environnement de développement avant la configuration :
capacitor-setup --diagnostic
# ou
capacitor-setup --check
# ou
capacitor-setup -dLe diagnostic vérifiera :
- Environnement général : Node.js, npm, Git
- Développement Android : Java/JDK, Android SDK, ADB, Android Studio
- Développement iOS : Xcode, simulateurs iOS (macOS uniquement)
- Capacitor : Packages du projet et configuration
📋 Ce que fait le script
- 🔍 Détection : Vérifie les installations Capacitor existantes
- 🧹 Nettoyage : Options de suppression ciblée par plateforme
- 📱 Sélection : Choix interactif des plateformes (Android/iOS/les deux)
- 📝 Configuration : Saisie interactive du nom d'app et bundle ID
- 📦 Installation :
npm installdes dépendances Capacitor - ⚙️ Config : Génération/mise à jour de
capacitor.config.ts - 🚀 Platforms :
npx cap add android/iosselon sélection - 🔨 Build :
npm run generatepour créer.output/public - 🔄 Sync :
npx cap syncpour synchroniser avec les plateformes - ✅ Finalisation : Affichage des commandes de lancement
📁 Structure générée
votre-projet/
├── android/ # Projet Android Studio (si sélectionné)
├── ios/ # Projet Xcode (si sélectionné)
├── capacitor.config.ts # Configuration Capacitor
├── .output/public/ # Build de votre SPA
└── node_modules/ # Dépendances Capacitor🎨 Interface
Le script affiche une interface colorée avec :
- 🎯 Bannières ASCII stylisées
- 📱🍎 Émojis pour chaque plateforme
- 🔥 Codes couleur pour les actions (vert=succès, rouge=erreur, etc.)
- 📋 Menus interactifs numérotés
- ✅ Feedback en temps réel
🔧 Configuration générée
Le script crée automatiquement un capacitor.config.ts optimisé :
import type { CapacitorConfig } from '@capacitor/cli';
const config: CapacitorConfig = {
appId: 'com.votre-app.mobile',
appName: 'Votre App',
webDir: '.output/public',
server: {
androidScheme: 'https',
iosScheme: 'ionic'
},
android: {
allowMixedContent: true
},
ios: {
allowsLinkPreview: false
}
};
export default config;🚨 Gestion d'erreurs
Le script inclut un système robuste de gestion d'erreurs :
- 🧹 Cleanup automatique en cas d'échec
- 📊 Tracking des ressources créées
- 🔄 Restauration de l'état initial si nécessaire
- 💬 Messages d'erreur explicites en plusieurs langues
📄 Licence
MIT
👨💻 Auteur
Sebastien Poupineau
💡 Conseils :
- Le script propose des options de nettoyage ciblé (Android seul, iOS seul, ou les deux)
- Gardez Android Studio et Xcode fermés pendant l'installation
- Le script préserve automatiquement les plateformes non sélectionnées lors des mises à jour