TypeScriptSupport et fonctionnalités améliorés - AWS Cloud9

AWS Cloud9 n'est plus disponible pour les nouveaux clients. Les clients existants de AWS Cloud9 peuvent continuer à utiliser le service normalement. En savoir plus »

Les traductions sont fournies par des outils de traduction automatique. En cas de conflit entre le contenu d'une traduction et celui de la version originale en anglais, la version anglaise prévaudra.

TypeScriptSupport et fonctionnalités améliorés

L'AWS Cloud9IDE vous permet d'utiliser des projets linguistiques pour accéder à des fonctionnalités de productivité améliorées pourTypeScript. Un projet de langage est un ensemble de fichiers, dossiers et paramètres apparentés dans l'IDE pour un environnement de développement AWS Cloud9.

Pour utiliser l'IDE afin de créer un projet de langage dans votre environnement, consultez Création d'un Language Project.

Fonctions de productivité du projet disponibles

L'AWS Cloud9IDE fournit les fonctionnalités de productivité de projet suivantes pourTypeScript.

Remplissage automatique

Au fur et à mesure que vous saisissez dans un fichier dans l'éditeur, une liste de symboles s'affiche au point d'insertion pour ce contexte, si des symboles sont disponibles.

Pour insérer un symbole dans la liste au point d'insertion, si le symbole n'est pas déjà sélectionné, choisissez-le en utilisant votre flèche vers le haut ou vers le bas, puis appuyez sur Tab.

Avant d'appuyer sur Tab, vous pouvez voir une bulle d'aide qui contient des informations sur le symbole que vous choisissez, si des informations sont disponibles.

Pour fermer la liste sans insérer de symbole, appuyez sur Esc.

Gutter Icons

Des icônes peuvent s'afficher dans la marge pour le fichier actif. Ces icônes soulignent les problèmes éventuels, comme des avertissements et des erreurs dans le code avant que vous ne l'exécutiez.

Pour plus d'informations sur un problème, placez votre pointeur sur l'icône du problème.

Correctifs rapides

Dans le fichier actif dans l'éditeur, vous pouvez afficher des informations sur les erreurs et les avertissements de codage, avec les correctifs possibles que vous pouvez appliquer automatiquement à ce code. Pour afficher les informations sur les erreurs ou les avertissements, ainsi que les correctifs possibles, choisissez n'importe quelle partie du code qui comporte un soulignement en pointillés rouges (pour les erreurs) ou un soulignement en pointillés gris (pour les avertissements). Ou, en laissant le curseur sur le code qui comporte un soulignement en pointillés rouges ou gris, appuyez sur Option-Enter (pour macOS) ou sur Alt-Enter (pour Linux ou Windows). Pour appliquer un correctif proposé, choisissez le correctif dans la liste ou utilisez les touches fléchées pour le sélectionner, puis appuyez sur Enter. Pour activer ou désactiver la sélection des correctifs rapides à l'aide d'un clic de souris, choisissez AWS Cloud9, Preferences (Préférences), User Settings (Paramètres utilisateur), Language (Langage), Hints & Warnings (Indices et avertissements), Show Available Quick Fixes on Click (Afficher les correctifs rapides disponibles d'un clic).

Find References

Dans le fichier actif dans l'éditeur, vous pouvez afficher toutes les références pour le symbole au point d'insertion, si l'IDE a accès à ces références.

Pour ce faire, au point d'insertion n'importe où dans le symbole, exécutez la commande Find References . Par exemple :

  • Cliquez avec le bouton droit de la souris au point d'insertion, puis choisissez Rechercher les références.

  • Dans la barre de menus, choisissez Go, Find References.

  • Appuyez sur Shift-F3 par défaut pour macOS, Windows ou Linux.

Si les références sont disponibles, un volet s'ouvre sur le fichier actif, en regard de ce symbole. Le volet contient une liste des fichiers dans lequel le symbole est référencé. Le volet affiche la première référence dans la liste. Pour afficher une autre référence, choisissez cette référence dans la liste.

Pour fermer le volet, choisissez l'icône de fermeture (X) dans le volet, ou appuyez sur Esc.

La commande Find References peut être désactivée, ou peut ne pas fonctionner comme escompté, dans les conditions suivantes :

  • Il n'y a pas de référence à ce symbole dans le fichier actif du projet.

  • L'IDE ne peut pas trouver tout ou partie des références de ce symbole dans le fichier actif du projet.

  • L'IDE n'a pas accès à un ou plusieurs emplacements où ce symbole est référencé dans le fichier actif du projet.

Go to Definition

Dans le fichier actif dans l'éditeur, vous pouvez aller d'un symbole à l'endroit où ce symbole est défini, si l'IDE a accès à cette définition.

Pour ce faire, au point d'insertion n'importe où dans le symbole, exécutez la commande Jump to Definition . Par exemple :

  • Cliquez avec le bouton droit de la souris au point d'insertion, puis choisissez Jump to Definition.

  • Dans la barre de menus, choisissez Go, Jump to Definition.

  • Appuyez sur F3 par défaut pour macOS, Windows ou Linux.

Si la définition est disponible, le point d'insertion passe sur cette définition, même si cette définition est dans un fichier distinct.

La commande Jump to Definition peut être désactivée, ou peut ne pas fonctionner comme escompté, dans les conditions suivantes :

  • Le symbole est un symbole primitif pour ce langage.

  • L'IDE ne peut pas trouver l'emplacement de la définition dans le projet du fichier actif.

  • L'IDE n'a pas accès à l'emplacement de la définition dans le projet du fichier actif.

Go to Symbol

Vous pouvez accéder à un symbole spécifique au sein d'un projet, comme suit.

  1. Activez l'un des fichiers dans le projet en l'ouvrant dans l'éditeur. Si le fichier est déjà ouvert, choisissez l'onglet du fichier dans l'éditeur pour rendre le fichier actif.

  2. Exécutez la commande Go to Symbol . Par exemple :

    • Choisissez le bouton Go (loupe). Dans la boîte Accédez à tout saisissez @, puis commencez à taper le symbole.

    • Dans la barre de menus, choisissez Go, Go to Symbol. Dans la fenêtre Go, commencez à taper le symbole après @.

    • Appuyez sur Command-2 ou Command-Shift-O par défaut pour macOS ou Ctrl-Shift-O par défaut pour Windows ou Linux. Dans la fenêtre Go, commencez à taper le symbole après @.

    Par exemple, pour trouver tous les symboles dans le projet nommé toString, commencez à taper @toString (ou commencez à taper toString après @, si @ est déjà affiché).

  3. Si vous voyez le symbole que vous voulez dans la liste Symboles, choisissez-le en cliquant sur celui-ci. Ou utilisez votre flèche vers le haut ou vers le bas pour le sélectionner, puis appuyez sur Enter. Le point d'insertion bascule sur ce symbole.

Si le symbole que vous souhaitez consulter n'est pas dans le projet du fichier actif, cette procédure peut ne pas fonctionner comme prévu.

Création d'un Language Project

Utilisez la procédure suivante pour créer un projet de langage qui fonctionnera avec les fonctions de productivité de projet prises en charge dans l'IDE AWS Cloud9.

Note

Nous vous recommandons d'utiliser les fonctionnalités de productivité du projet sur les fichiers qui font partie d'un projet langage. Même si vous pouvez utiliser certaines fonctionnalités de productivité du projet sur un fichier qui ne fait pas partie d'un projet, ces fonctionnalités peuvent entraîner des résultats inattendus.

Par exemple, vous pouvez utiliser l'IDE pour rechercher des références et des définitions à partir d'un fichier à la racine d'un environnement qui ne fait pas partie d'un projet. L'IDE peut ensuite uniquement rechercher des fichiers à cette même racine. Cela peut entraîner l'absence de références ou de définitions trouvées, même si ces références ou définitions existent dans des projets langage ailleurs dans le même environnement.

Création d'un projet TypeScript linguistique

  1. Assurez-vous de l'avoir TypeScript installé dans l'environnement. Pour de plus amples informations, veuillez consulter Étape 1 : Installer les outils requis dans le TypeScripttutoriel pourAWS Cloud9.

  2. Dans une séance de terminal dans l'IDE pour l'environnement, basculez vers le répertoire dans lequel vous souhaitez créer le projet. Si le répertoire n'existe pas, créez-le puis accédez-y. Par exemple, les commandes suivantes créent un répertoire nommé my-demo-project à la racine de l'environnement (dans ~/environment), puis basculent vers ce répertoire.

    mkdir ~/environment/my-demo-project cd ~/environment/my-demo-project
  3. À la racine du répertoire dans lequel vous souhaitez créer le projet, exécutez le TypeScript compilateur avec l'--initoption.

    tsc --init

    Si cette commande aboutit, le TypeScript compilateur crée un tsconfig.json fichier à la racine du répertoire du projet. Vous pouvez utiliser ce fichier pour définir divers paramètres du projet, tels que les options TypeScript du compilateur et les fichiers spécifiques à inclure ou à exclure du projet.

    Pour plus d'informations sur le fichier tsconfig.json, consultez les ressources suivantes :