Table de travail
Améliorations au niveau de la commande Configurer la langue d'affichage
La commande Configurer la langue d'affichage a été actualisée pour inclure :
Affichage du tableau du panneau Problèmes
Lors de cette
étape, Microsoft a ajouté une nouvelle fonctionnalité permettant aux
utilisateurs de basculer le mode d'affichage du panneau Problèmes entre
un arbre et un tableau. Par rapport à l'arborescence, le tableau
présente la source (service de langage ou extension) de chaque problème,
ce qui permet aux utilisateurs de filtrer les problèmes par leur
source.
Vous pouvez basculer l'affichage de l'interface
utilisateur avec le bouton Afficher sous forme de tableau/Afficher sous
forme d'arborescence dans le coin supérieur droit du panneau Problèmes
ou modifier le mode d'affichage par défaut avec le paramètre Problèmes :
mode d'affichage par défaut.
Extensions obsolètes
Dans
cette étape, Microsoft a ajouté la prise en charge des extensions
obsolètes dans VS Code. Une extension peut être simplement dépréciée ou
obsolète au profit d'une autre extension ou lorsque sa fonctionnalité
est intégrée à VS Code. VS Code rendra les extensions obsolètes dans la
vue Extensions, comme indiqué ci-dessous.
Une extension obsolète qui n'est plus maintenue.
Une extension obsolète au profit d'une autre extension. Dans ce cas, VS
Code n'autorise pas les utilisateurs à installer cette extension.
Une extension obsolète avec sa fonctionnalité intégrée à VS Code qui peut être activée en configurant les paramètres.
VS
Code ne migrera pas ou ne désinstallera pas automatiquement une
extension obsolète. Il y aura un bouton Migrer pour vous guider pour
passer à l'extension recommandée.
Extensions de parrainage
VS
Code permet désormais aux utilisateurs de parrainer leurs extensions
préférées. Lorsqu'une extension peut être sponsorisée, VS Code affichera
un bouton Sponsor dans la page Détails de la vue Extensions comme
ci-dessous :
Le bouton Parrainer vous dirigera vers l'URL de parrainage de l'extension, où vous pourrez apporter votre soutien.
Masquer les fichiers dans l'explorateur basé sur .gitignore
L'explorateur de fichiers prend désormais en charge l'analyse et le masquage des fichiers exclus par votre fichier .gitignore. Cela peut être activé via le paramètre Explorer: Exclude Git Ignore (explorer.excludeGitIgnore). Ce paramètre fonctionne avec files.exclude pour masquer les fichiers indésirables de l'explorateur.
Verrouiller la position de survol
Certains
survols personnalisés sont difficiles ou impossibles à déclencher avec
la souris en raison de la présence d'autres éléments de l'interface
utilisateur (par exemple, une barre de défilement). Maintenir Alt
pendant qu'un survol est actif le "verrouillera" désormais, lui donnant
une bordure plus large et empêchant le mouvement de la souris en dehors
du survol de le cacher. Il s'agit principalement d'une fonctionnalité
d'accessibilité pour que les survols fonctionnent bien avec les loupes
d'écran, mais il est également utile pour copier du texte à partir de
survols. Notez que cette fonctionnalité ne s'applique qu'en dehors de
l'éditeur, car les survols de l'éditeur peuvent toujours être
déclenchés, sauf indication contraire via le paramètre editor.hover.sticky.
Améliorations de l'éditeur de paramètres
L'éditeur de
paramètres affiche désormais un indicateur de remplacement de la valeur
par défaut pour les paramètres spécifiques au langage. Vous pouvez
afficher les paramètres spécifiques au langage en ajoutant un filtre de
langage dans la barre de recherche de l'éditeur de paramètres, soit en
le saisissant explicitement (@lang:javascript), soit en cliquant sur le bouton de filtre à droite de la barre de recherche et en sélectionnant la langue option.
Lorsque
l'indicateur de remplacement de la valeur par défaut s'affiche, cela
indique que la valeur par défaut du paramètre spécifique au langage a
été remplacée par une extension. L'indicateur indique également quelle
extension a remplacé la valeur par défaut.
Cette itération
corrige également un comportement où certains liens dans l'éditeur de
paramètres n'étaient pas correctement redirigés alors qu'il y avait déjà
une requête de recherche dans la barre de recherche de l'éditeur de
paramètres. Les liens ont également maintenant un style approprié afin
qu'il soit plus clair lorsque l'on les survole.
Terminal
Trouver la couleur d'arrière-plan correspondante
Côté
terminal, la version précédente a été implémentée pour afficher une
bordure autour de toutes les correspondances, mais il s'agissait d'une
solution temporaire jusqu'à ce que la prise en charge de la modification
dynamique de l'arrière-plan des cellules soit possible. Un arrière-plan
coloré est désormais la valeur par défaut pour les thèmes lors de la
mise en surbrillance des correspondances et l'expérience globale doit
ressembler à celle de l'éditeur.
Améliorations du contraste et du rapport de contraste minimum
Le
travail d'arrière-plan de recherche de correspondance a ajouté beaucoup
plus de flexibilité dans la façon dont le terminal fonctionne avec les
couleurs d'arrière-plan et de premier plan. Pour cette raison, des
améliorations ont été apportées autour du contraste dans le terminal,
alignant les visuels du terminal plus près de l'éditeur. De plus, il
existe désormais la fonction de rapport de contraste minimum qui modifie
dynamiquement le premier plan du texte pour améliorer la visibilité.
Langages
TypeScript 4.7
VS
Code est désormais compatible avec TypeScript 4.7.3. Ce TypeScript
majeur apporte de nouvelles fonctionnalités de langage, notamment une
analyse de flux de contrôle améliorée et la prise en charge de la prise
en charge du module ECMAScript dans Node.js. Il inclut également de
nouvelles fonctionnalités d'outillage et corrige un certain nombre de
bogues importants.
Aller à la définition de la source
L'une
des demandes de fonctionnalités les plus anciennes et les plus votées
de VS Code consiste à faire en sorte que VS Code navigue vers
l'implémentation JavaScript de fonctions et de symboles à partir de
bibliothèques externes. Actuellement, Aller à la définition
permet d'accéder au fichier de définition de type (le fichier .d.ts) qui
définit les types de la fonction ou du symbole cible. Ceci est utile si
vous avez besoin d'inspecter les types ou la documentation de ces
symboles, mais masque l'implémentation réelle du code. Le comportement
actuel déroute également de nombreux utilisateurs de JavaScript qui
peuvent ne pas comprendre le type TypeScript du .d.ts.
Bien que changer Aller à la définition
pour accéder à l'implémentation JavaScript d'un symbole puisse sembler
simple, il y a une raison pour laquelle cette demande de fonctionnalité
est ouverte depuis si longtemps. JavaScript (et en particulier le
JavaScript compilé livré par de nombreuses bibliothèques) est beaucoup
plus difficile à analyser qu'un .d.ts. Essayer d'analyser tout le code
JavaScript sous node_modules serait à la fois lent et augmenterait
également considérablement l'utilisation de la mémoire. Il existe
également de nombreux modèles JavaScript que le moteur VS Code
IntelliSense n'est pas en mesure de comprendre.
C'est là qu'intervient la nouvelle commande Aller à la définition source.
Lorsque vous exécutez cette commande à partir du menu contextuel de
l'éditeur ou de la palette de commandes, TypeScript tentera de
rechercher l'implémentation JavaScript du symbole et d'y accéder. Cela
peut prendre quelques secondes et nous n'obtenons pas toujours le bon
résultat, mais cela devrait être utile dans de nombreux cas.
Commande Organiser les importations
La commande
Organiser les importations pour JavaScript et TypeScript vous permet de
nettoyer rapidement votre liste d'importations. Lorsqu'il est exécuté,
il supprime les importations inutilisées et trie également les
importations par ordre alphabétique.
Cependant, certaines bases
de code aiment avoir un certain degré de contrôle manuel sur la façon
dont leurs importations sont organisées. Le regroupement des
importations externes par rapport aux importations internes en est l'un
des exemples les plus courants :
Code TypeScript : | Sélectionner tout |
<table><tbody><tr><td width="33" valign="top">1 2 3 4 5 6 7 8 9 10 11 </td><td valign="top"><pre>// local code import * <b>as</b> bbb from './bbb'; import * <b>as</b> ccc from './ccc'; import * <b>as</b> aaa from './aaa'; // built-ins import * <b>as</b> path from 'path'; import * <b>as</b> child_process from 'child_process'; import * <b>as</b> fs from 'fs'; // some code...</pre></td></tr></tbody></table>
Dans les anciennes versions de VS Code, l'exécution d'Organiser les importations ici entraînerait ce qui suit :
Code TypeScript : | Sélectionner tout |
<table><tbody><tr><td width="33" valign="top">1 2 3 4 5 6 7 8 9 10 </td><td valign="top"><pre>// local code import * <b>as</b> child_process from 'child_process'; import * <b>as</b> fs from 'fs'; // built-ins import * <b>as</b> path from 'path'; import * <b>as</b> aaa from './aaa'; import * <b>as</b> bbb from './bbb'; import * <b>as</b> ccc from './ccc'; // some code...</pre></td></tr></tbody></table>
Cela se produit parce que toutes les importations sont triées par ordre
alphabétique et que VS Code essaie même de conserver les commentaires et
les nouvelles lignes tout en le faisant.
Cependant, avec
TypeScript 4.7, Organiser les importations est désormais compatible avec
les groupes. L'exécuter sur le code ci-dessus ressemble un peu plus à
ce à quoi vous vous attendiez :
Code TypeScript : | Sélectionner tout |
<table><tbody><tr><td width="33" valign="top">1 2 3 4 5 6 7 8 9 10 11 </td><td valign="top"><pre>// local code import * <b>as</b> aaa from './aaa'; import * <b>as</b> bbb from './bbb'; import * <b>as</b> ccc from './ccc'; // built-ins import * <b>as</b> child_process from 'child_process'; import * <b>as</b> fs from 'fs'; import * <b>as</b> path from 'path'; // some code...</pre></td></tr></tbody></table>
Source : Microsoft
Commenting for this entry has expired.