Développement d’un complément Office avec Visual Studio Code
Cet article explique comment utiliser Visual Studio Code (VS Code) pour développer votre complément Office.
Remarque
Pour en savoir plus sur l’utilisation de Visual Studio pour créer un complément Office, voir Développer des compléments Office avec Visual Studio.
Conditions préalables
Node.js (la dernière version LTS) Visitez le siteNode.js pour télécharger et installer la version appropriée pour votre système d’exploitation.
La dernière version deYeoman et du Générateur Yeoman Générateur de compléments Office. Pour installer ces outils globalement, exécutez la commande suivante via l’invite de commande.
npm install -g yo generator-officeRemarque
Même si vous avez précédemment installé le générateur Yeoman, nous vous recommandons de mettre à jour votre package vers la dernière version de npm.
Office connecté à un abonnement Microsoft 365 (y compris Office on the web).
Remarque
Si vous n’avez pas encore Office, vous pouvez bénéficier d’un abonnement Microsoft 365 E5 développeur par le biais du Programme pour les développeurs Microsoft 365. Pour plus d’informations, consultez le FAQ. Vous pouvez également vous inscrire à un essai gratuit de 1 mois ou acheter un plan Microsoft 365.
Créez le projet de complément à l’aide du générateur Yeoman
Si vous utilisez le VS Code comme environnement de développement intégré (IDE), vous devez créer le projet de complément Office avec le genérateur Yeoman pour les compléments Office. Le générateur Yeoman crée un projet Node js qui peut être géré avec VS Code ou n’importe quel autre éditeur.
Pour créer un complément Office avec le générateur Yeoman, suivez les instructions dans le démarrage rapide de 5 minutes qui correspond au type de complément que vous voulez créer.
Développer le complément à l’aide de VS Code
Lorsque le générateur Yeoman a terminé de créer le projet de complément, ouvrez le dossier racine du projet avec VS Code.
Conseil
Dans Windows, vous pouvez accéder au répertoire racine du projet via la ligne de commande, puis entrer code . pour ouvrir ce dossier dans VS Code. Sur Mac, vous devez ajouter la commande code au chemin d’accès avant de pouvoir utiliser cette commande pour ouvrir le dossier de projet dans VS Code.
Le générateur Yeoman crée un complément de base avec une fonctionnalité limitée. Vous pouvez personnaliser le complément en modifiant le manifeste, HTML, JavaScript ou TypeScript et des fichiers CSS dans VS Code. Pour obtenir une description générale de la structure de projet et des fichiers dans le projet de complément que le générateur Yeoman crée, consultez les instructions du générateur Yeoman dans le démarrage rapide de 5 minutes qui correspond au type de complément que vous avez créé.
Créer le projet de complément à l’aide du Kit de développement des compléments Office (préversion)
Le Kit de développement des compléments Office est une extension Visual Studio Code qui vous permet de créer des projets directement à partir de VS Code. Pour plus d’informations sur l’installation de l’extension et la création de projets à partir de modèles et d’exemples, voir Créer des projets de complément Office à l’aide du Kit de développement de compléments Office pour Visual Studio Code.
Importante
L’extension du Kit de développement des compléments Office est actuellement en préversion. Il prend uniquement en charge la création de compléments qui utilisent le manifeste du complément uniquement. Il crée également uniquement des compléments Excel, PowerPoint et Word pour l’instant. La prise en charge d’Outlook est en cours de développement, tout comme des exemples supplémentaires et d’autres améliorations. Nous vous invitons à nous faire part de vos commentaires sur l’outil. Les demandes de problèmes et de fonctionnalités doivent être envoyées via des problèmes GitHub sur le dépôt de l’extension.
Tester et déboguer le complément
Les méthodes de test, de débogage et de résolution des problèmes liés aux compléments Office varient selon la plateforme. Pour plus d’informations, voir Test et débogage de compléments Office.
Publier le complément
Un complément Office comprend une application Web et un fichier manifeste. L’application Web définit l’interface utilisateur et les fonctionnalités du complément, tandis que le manifeste spécifie l’emplacement de l’application Web et définit les paramètres et fonctionnalités du complément.
Lorsque vous développez votre complément, vous pouvez l’exécuter sur votre serveur Web local (localhost), mais lorsque vous êtes prêt à le publier pour permettre à d’autres utilisateurs d’y accéder, vous devez déployer l’application Web sur un serveur Web ou un service d’hébergement Web (par exemple, Microsoft Azure), puis mettre à jour le manifeste pour spécifier l’URL de l’application déployée.
Lorsque votre complément fonctionne comme vous le souhaitez et que vous êtes prêt à le publier pour que d’autres utilisateurs y accèdent, effectuez les étapes suivantes.
À partir de la ligne de commande, dans le répertoire racine de votre projet de complément, exécutez la commande suivante pour préparer tous les fichiers pour le déploiement de production.
npm run buildUne fois la build terminée, le dossier dist dans le répertoire racine de votre projet de complément contient les fichiers que vous allez déployer dans les étapes suivantes.
Chargez le contenu du dossier dist sur le serveur Web qui héberge votre complément. Vous pouvez utiliser n’importe quel type de serveur Web ou de service d’hébergement Web pour héberger votre complément.
Dans VS Code, ouvrez le fichier manifeste du complément situé dans le répertoire racine du projet (
manifest.xml). Remplacez toutes les occurrences dehttps://localhost:3000par l’URL de l’application Web que vous avez déployée sur un serveur Web à l’étape précédente.Choisir la méthode que vous voulez utiliser pour déployer votre complément Office, puis suivre les instructions pour publier le fichier manifeste.