Le développement Ionic sous Android et iOS

• Installer XCode

• Créer un projet Ionic pour iOS

• Configurer XCode

Pour développer une application iOS, il faut également mettre en place un environnement de développement approprié. Nous allons commencer par présenter les outils de base nécessaires pour travailler efficacement. Puis nous verrons ensuite comment configurer un projet Ionic pour iOS, cela ressemble beaucoup à la configuration d'un projet android à quelques détails près.

Pour développer une application pour iOS, il est nécessaire d'installer un environnement de développement spécifique à la plate-forme. Dans un premier temps, il faut absolument posséder une machine qui fonctionne via MacOS. L'installation de tous les outils nécessaires est effectuée via l'installation de l'IDE XCode.

Pour installer XCode, il faut passer depuis l'AppStore (d'où la nécessité d'avoir un compte Apple).

Une fois l'installation terminée, il faut installer les outils via la ligne de commande. Lancer la commande suivante :

Pour permettre de tester des applications iOS sur des émulateurs ou des appareils physiques, il est obligatoire de se connecter à un compte Apple pour pouvoir récupérer les Provisionnings Profiles (Profils de signature).

En fonction du type de compte ajouté, les fonctions ne seront pas toutes disponibles.

- Utilisation de son compte Apple ID, création d'un profil "Personnal Team". Ce profil est le minimum requis.

- Utilisation d'un compte Developper, création d'un profil "Developper Team". Ce profil est obligatoire pour pouvoir connecter son device physique et pouvoir tester son application.

- Utilisation d'un compte Enterprise, création d'un profil "Enterprise". Ce profil permettra de déployer directement l'application sous les devices enregistrés dans le compte.

Pour activer son compte developper, il faut se connecter au site : https://developer.apple.com/ et acheter une licence (99 $ / an).

Ouvrir XCode, dans les préférences (XCode » Préférences » Accounts), ajouter les informations de connexion de son compte Apple. La Team va être automatiquement mise à jour.

Par défaut, dans XCode, il existe déjà un certain nombre de simulateurs déjà disponible que ce soit pour les iPhone ou le iPad. Pour vérifier la liste, il faut aller dans le menu Window » Devices and Simulators. Il est possible d'ajouter des nouveaux modèles.

Avant toutes opérations sur le projet iOS, il faut que le projet Ionic soit compilé au format WebApp. Il faut lancer la commande

Cette commande va créer un dossier dist ou www à la racine du projet. Selon le dossier créé, il faut modifier dans le fichier capacitor.config.json la propriété webDir.

Pour ajouter et configurer la plateforme iOS sur un projet Ionic, il suffit de se rendre dans le dossier du projet qui aura été au préalable créé et taper les commandes :

L'exécution de cette commande permet de créer un dossier ios à la racine du projet. Ce dossier va comporter un projet natif iOS (Swift / Objective-C) qui pourra être modifié directement depuis XCode.

Capacitor permet de faire une distinction nette entre le projet Ionic et le projet Natif. Tous ce qui concerne l'application Web devra être géré via Ionic. Tout ce qui concerne la partie Native (Icônes, Permissions, Signatures, etc.) devront être gérés via XCode.

Il est important que ce dossier soit enregistré dans le gestionnaire de sources pour ne pas perdre les configurations.

Si on effectue une mise à jour du projet Ionic, on peut mettre à jour notre projet natif via les deux commandes suivantes :

La première commande va mettre à jour les dépendances du projet natif et copier les assets Web. Cette commande doit être exécutée si on ajoute un nouveau plugin Capacitor/Cordova ou qu'une version est modifiée.

La seconde commande va uniquement copier les assets Web.

Pour ouvrir le projet iOS, il faut lancer la commande

Cette commande va ouvrir XCode directement sur le bon dossier. Ensuite il sera possible de lancer l'application sur un émulateur ou un device réel connecté à l'ordinateur.