Installer Visual Studio Tools for Apache Cordova

Cet article fait référence à Visual Studio Tools pour Apache Cordova, qui correspond à la version préliminaire du logiciel. Les fonctionnalités décrites sont dans l'aperçu et sont sujettes à modification. Vous pouvez télécharger l'aperçu à partir du Centre de téléchargement Microsoft.

Cet article explique comment installer les outils et les dépendances tierces nécessaires à la création d'applications Cordova interplateformes à l'aide de Visual Studio Tools for Apache Cordova :

Spécifications
Obtention des outils
Installation des outils
Installation manuelle des dépendances
Installation des outils pour iOS
Remplacement des variables d'environnement système

Spécifications

• Un des systèmes d'exploitation suivants : Windows 7, Windows 8, Windows 8.1 ou Windows Server 2012 R2.

  Important

  Si vous utilisez Windows 7, vous pouvez développer des applications pour Android et iOS, mais pas pour Windows ou Windows Phone.

• Visual Studio 2013 Update 4 (Professional, Ultimate, Premium ou Community Edition) avec les fonctionnalités suivantes installées :

  • Outils de maintenance des applications du Windows Store pour Windows 8

  • Kit de développement logiciel (SDK) Windows Phone 8.0

    Vous pouvez ajouter ces fonctionnalités à une installation existante de Visual Studio 2013 Update 4. Dans le Panneau de configuration, sélectionnez Programmes et fonctionnalités. Sélectionnez Visual Studio 2013 dans la liste, puis sélectionnez Modifier. Dans la fenêtre du programme d'installation de Visual Studio, sélectionnez Modifier. Dans la liste des fonctionnalités, sélectionnez les deux options, comme indiqué dans l'illustration.

    

• Si vous utilisez Visual Studio 2015 Preview au lieu de Visual Studio 2013, consultez la procédure d'installation dans cette rubrique.

Pour créer des applications pour des plateformes d'appareils spécifiques, il y a quelques spécifications requises supplémentaires :

• L'émulateur Android fonctionne mieux sur les ordinateurs qui peuvent s'exécuter le pilote Intel HAXM. Consultez Exécuter votre application Apache Cordova sur Android.

• Les émulateurs Windows Phone nécessitent un ordinateur qui peut exécuter Hyper-V. Pour plus d'informations, consultez la configuration système requise de l'émulateur.

• iOS et le simulateur iOS nécessitent un ordinateur Mac capable d'exécuter Xcode 6 (Xcode 6 est recommandé). Pour les étapes supplémentaires, consultez Installer les outils de génération pour iOS.

  Conseil

  Si vous souhaitez générer iOS sur un service cloud plutôt que sur du matériel Mac, consultez Générer et simuler iOS dans le cloud.

Se procurer les outils

Pour vous procurer l'extension Visual Studio Tools for Apache Cordova, accédez au Centre de téléchargement Microsoft. Suivez les étapes décrites dans la section suivante pour installer l'extension.

Important

Si vous avez déjà installé une version CTP antérieure de Visual Studio Tools for Apache Cordova (Applications hybrides multi-appareils), vous devez commencer par désinstaller la version CTP dans le Panneau de configuration, dans Programmes et fonctionnalités avant d'installer Visual Studio 2013 Update 4 et la version CTP actuelle.

Dans Visual Studio 2015 Preview, l'extension Visual Studio Tools for Apache Cordova peut être installée en tant que fonctionnalité facultative au cours de l'installation. Pour consulter la procédure d'installation, reportez-vous à Prise en main de Visual Studio Tools for Apache Cordova.

Installer les outils

Le programme d'installation installe d'abord un correctif de Visual Studio pour prendre en charge le développement d'applications Cordova. Il vous donne ensuite la possibilité d'installer les logiciels tiers suivants. La plupart de ceux-ci sont des logiciels open source requis par des plateformes spécifiques ou par Apache Cordova.

• Joyent Node.js permet à Visual Studio de s'intégrer à l'interface de ligne de commande Apache Cordova et à l'émulateur Apache Ripple.

• L'interface de ligne de commande Git est requise seulement si vous devez ajouter manuellement des URI Git pour des plug-ins Cordova spécifiques.

• Google Chrome est requis pour exécuter l'émulateur Apache Ripple pour iOS et Android.

• Apache Ant 1.8.0 ou ultérieur est requis pour le processus de génération Android.

• Oracle Java JDK 7 est requis pour le processus de génération Android.

• Le Kit de développement logiciel (SDK) Android est requis pour le processus de génération Android et pour Ripple.

• SQLite pour Windows Runtime est requis pour ajouter une connectivité SQL aux applications Windows (pour le plug-in WebSQL Polyfill).

• Apple iTunes est requis pour le déploiement d'une application sur un appareil iOS connecté à votre PC Windows.

Pour installer l'extension Visual Studio et les dépendances

1. Exécutez le programme d'installation que vous avez trouvé dans Se procurer les outils.

2. Suivez les instructions pour installer l'extension Visual Studio.

3. Quand vous y êtes invité, autorisez le programme d'installation à installer les dépendances de logiciels tiers. Vous pouvez aussi désélectionner les logiciels et installer manuellement plus tard les dépendances dont vous avez besoin.

   Important

   Si les dépendances tierces sont déjà présentes sur votre système ou si vous choisissez de les installer manuellement, il peut être nécessaire de mettre à jour votre chemin d'accès système.Consultez Installation manuelle des dépendances.

   

4. Redémarrez votre ordinateur.

   Important

   Vous devez redémarrer pour vous assurer que tout est installé correctement.

5. Ouvrez Visual Studio, sélectionnez Outils, puis Extensions et mises à jour, puis Mises à jour. Si une mise à jour de Visual Studio est disponible pour Visual Studio Tools for Apache Cordova, installez-la.

   Notes

   La première fois que vous générez une application après l'installation des outils, Visual Studio télécharge et installe les outils Cordova.La première génération prend donc davantage de temps.Consultez la fenêtre Sortie pour afficher la progression.

6. Avant d'exécuter votre application sur le simulateur iOS ou sur un appareil iOS, vous devez installer l'agent distant sur un ordinateur Mac. Consultez Installer les outils de génération pour iOS.

Installer manuellement des dépendances

Si vous choisissez de ne pas installer une ou plusieurs dépendances avec l'extension, vous pouvez les installer manuellement plus tard.

Avertissement

Vous pouvez installer les dépendances dans n'importe quel ordre, excepté pour Java.Vous devez installer et configurer Java avant d'installer le Kit de développement logiciel (SDK) Android.

Lisez les informations suivantes et utilisez ces liens pour installer des dépendances manuellement.

• Joyent Node.js

  Nous vous recommandons d'installer la version x86 de Node.js.

• Google Chrome

• Outils de ligne de commande Git

  Quand vous installez les outils de ligne de commande Git, sélectionnez l'option qui ajoute Git à votre chemin d'accès de l'invite de commandes.

  Avertissement

  Les outils en ligne de commande Git 1.9.3 sont installés par défaut.Des erreurs inattendues peuvent se produire si vous installez une version antérieure à 1.9.0.

• Apache Ant

  • Téléchargez et extrayez Ant vers un emplacement comme C:/ant-1.x.x

  • Définissez la variable d'environnement ANT_HOME pour qu'elle pointe vers l'emplacement précédent.

  • Ajoutez %ANT_HOME%\bin au chemin d'accès système.

    Notes

    Si vous avez besoin de définir cette variable d'environnement manuellement, consultez Remplacer des variables d'environnement système.

• Oracle Java 7

  • Définissez la variable d'environnement JAVA_HOME à C:/Program Files/Java/jdk1.7.0_55

  • Ajoutez ceci au chemin d'accès système : %JAVA_HOME%\bin

    Notes

    Si vous avez besoin de définir cette variable d'environnement manuellement, consultez Remplacer des variables d'environnement système.

• Kit de développement logiciel (SDK) Android avec les packages SDK suivants :

  • Outils du Kit de développement logiciel (SDK) Android (dernière version)

  • Outils de plateforme du Kit de développement logiciel (SDK) Android (dernière version)

  • Outils de génération du Kit de développement logiciel (SDK) Android (dernière version)

  • Android 4.4.x (niveau 19 d'API) avec les packages suivants :

    • Plateforme du Kit de développement logiciel (SDK)

    • Image système ARM EABI v7a

    • Image système Intel x86 Atom

    • Interfaces API Google (image système x86)

    • Interfaces API Google (image système ARM)

  L'illustration ci-dessous montre les packages requis dans le Gestionnaire du Kit de développement logiciel (SDK) Android.

  

  Définissez la variable d'environnement ADT_HOME avec l'emplacement d'installation du SDK.

  Ajouter ceci au chemin d'accès système : %ADT_HOME%\tools;%ADT_HOME%\platform-tools

  Si vous avez besoin de définir cette variable d'environnement manuellement, consultez Remplacer des variables d'environnement système.

  Conseil

  Si vous installez le SDK Android à son emplacement par défaut sous Windows, il est installé à l'emplacement C:\Program Files (x86)\Android\android-sdk.

• Apple iTunes (x86, x64)

• SQLite

• WebSocket4Net (requis si vous développez votre application sous Windows 7)

  1. Téléchargez WebSocket4Net(0.9).Binaries.zip depuis CodePlex.

  2. Depuis le fichier zip téléchargé, copiez net45\Release\WebSocket4Net.dll dans le dossier % ProgramFiles(x86) %\Microsoft Visual Studio 12.0\Common7\IDE\CommonExtensions\Microsoft\WebClient\Diagnostics\ToolWindows de votre ordinateur.

Installer les outils pour iOS

Quelques étapes supplémentaires sont requises pour générer et exécuter des applications pour iOS depuis Visual Studio. Consultez Installer les outils de génération pour iOS.

Remplacer des variables d'environnement système

Visual Studio détecte les configurations pour les logiciels tiers que vous avez installés et gère les chemins d'installation dans les variables d'environnement suivantes :

• ADT_HOME pointe vers le chemin d'installation d'Android.

• ANT_HOME pointe vers le dossier Ant de votre ordinateur.

• GIT_HOME pointe vers le chemin d'installation de Git.

• JAVA_HOME pointe vers le chemin d'installation de Java.

Visual Studio utilise ces variables d'environnement lors de la génération et de l'exécution de votre application. Vous pouvez afficher les variables d'environnement et examiner leur valeur via la boîte de dialogue Options de Visual Studio. Il peut être nécessaire de remplacer les valeurs par défaut pour une des raisons suivantes :

• Visual Studio n'a pas pu vérifier le chemin d'accès. Dans ce cas, un avertissement s'affiche en regard de la variable d'environnement.

• Vous disposez de plusieurs versions installées du logiciel et vous voulez en utiliser une version spécifique.

• Vous voulez que le chemin d'accès de l'environnement global soit différent de l'environnement local de Visual Studio.

Pour remplacer les variables

1. Dans la barre de menus de Visual Studio, sélectionnez Outils, Options.

2. Dans la boîte de dialogue Options, choisissez Tools for Apache Cordova, puis Remplacements de variable d'environnement.

3. Effectuez vos modifications :

   • Pour remplacer une valeur, activez sa case à cocher, puis modifiez la valeur.

     Si les informations de chemin d'accès sont non valides ou manquantes, Visual Studio affiche un message d'avertissement en regard de cette variable.

   • Pour réinitialiser une variable d'environnement à sa valeur par défaut, désactivez sa case à cocher ou sélectionnez Rétablir les valeurs par défaut.

4. Sélectionnez OK pour enregistrer vos modifications et fermer la boîte de dialogue.

Mise à jour manuelle de la version de Cordova

Visual Studio a été testé par rapport à une version spécifique d'Apache Cordova. Nous avons l'intention de prendre charge la sélection d'une version de Cordova pour chaque projet, mais même maintenant, il est possible d'appliquer un correctif pour utiliser une version différente de Cordova sur l'ensemble des projets de votre système.

Avertissement

L'application d'un correctif Visual Studio n'est pas prise en charge officiellement.Vous pouvez rencontrer des comportements inattendus et nous ne conseillons cette procédure qu'à des utilisateurs avancés.Le correctif apporte des modifications à l'échelle du système sur votre ordinateur.

Pour mettre à jour Visual Studio afin d'utiliser une autre version de Cordova

1. Après avoir installé Visual Studio Tools for Cordova, créez et générez un projet vide pour installer Cordova.

2. Ouvrez une ligne de commande et tapez la commande suivante :

   cd %appdata%\npm\node_modules\vs-mda\
   

   Si vous avez installé Node.js vous-même, vs-mda peut être installé dans un autre emplacement. La commande précédente montre l'emplacement d'installation par défaut.

3. Sur la ligne de commande, tapez la commande suivante :

   npm install cordova@version --save
   

   où version représente la version de l'interface CLI de Cordova que vous voulez utiliser. Par exemple, vous pouvez utiliser la version 4.1.0.

   Si vous avez installé Cordova à un autre endroit, vous pouvez taper cordova --version pour déterminer la version de Cordova.

   Important

   Veillez à omettre le commutateur global -g quand vous exécutez la commande d'installation précédente.

4. Exécutez une opération de « nettoyage » telle que Nettoyer la solution sur le projet que vous modifiez dans Visual Studio pour que le changement de version prenne effet.

Pour revenir à la version prise en charge de Cordova

• Ouvrez une invite de commandes et tapez :

  npm uninstall -g vs-mda
  

  Visual Studio réinstallera automatiquement vs-mda la prochaine fois que vous effectuerez une génération.

  Vous pouvez également rechercher le fichier vs-mda sous C:\Program Files (x86)\Microsoft Visual Studio 12.0\Common7\IDE\Extensions et modifier package.json pour faire référence à la version que vous souhaitez utiliser. Une fois la modification de package.json terminée, exécutez la commande suivante à partir du même dossier :

  npm install -g vs-mda
  

Pour la prise en charge de la build iOS sur votre Mac, la version de Cordova que vs-mda-remote utilise doit correspondre à la version que vous avez installée pour Visual Studio. La procédure suivante montre comment mettre à jour vs-mda-remote pour utiliser une version spécifique de Cordova. Pour obtenir des informations complètes sur l'installation des outils de génération iOS, reportez-vous à Installer les outils de génération pour iOS.

Pour mettre à jour vs-mda-remote sur votre Mac vers une autre version de Cordova

1. Ouvrez l'application Terminal sur votre Mac et tapez la commande suivante :

   cd /usr/local/lib/node_modules/vs-mda-remote
   

   Si vous n'avez pas installé vs-mda-remote globalement (-g), l'emplacement de vs-mda-remote peut être différent sur votre Mac. 

2. Tapez cette commande :

   sudo npm install cordova@version --save
   

   où version est la version de l'interface CLI de Cordova que vous avez installée précédemment. Par exemple, ce peut être 4.1.0.

   Important

   Veillez à omettre le commutateur global -g quand vous exécutez la commande d'installation précédente.

   Si vous avez installé Cordova ailleurs, vous pouvez taper cordova --version pour déterminer la version de Cordova.

   Exécutez une opération de « nettoyage » telle que Nettoyer la solution sur le projet que vous modifiez dans Visual Studio pour que le changement de version prenne effet.

Pour ramener vs-mda-remote sur votre Mac à la version prise en charge

1. Ouvrez l'application Terminal sur votre Mac et tapez :

   sudo npm uninstall -g vs-mda-remote
   

2. Tapez la commande suivante :

   sudo npm install -g vs-mda-remote --save
   

    

Voir aussi

Concepts

Installer les outils de génération pour iOS

Autres ressources

Télécharger les outils

FAQ

Problèmes connus