{"id":34262,"date":"2020-04-14T15:04:29","date_gmt":"2020-04-14T14:04:29","guid":{"rendered":"https:\/\/blog.jetbrains.com\/fr\/?p=628"},"modified":"2020-07-01T13:16:12","modified_gmt":"2020-07-01T13:16:12","slug":"webstorm-2020-1-amelioration-de-lergonomie-prise-en-charge-de-vuex-prettier-lors-de-lenregistrement-et-bien-plus-encore","status":"publish","type":"post","link":"https:\/\/blog.jetbrains.com\/fr\/2020\/04\/14\/webstorm-2020-1-amelioration-de-lergonomie-prise-en-charge-de-vuex-prettier-lors-de-lenregistrement-et-bien-plus-encore\/","title":{"rendered":"WebStorm 2020.1\u00a0: am\u00e9lioration de l’ergonomie, prise en charge de Vuex, Prettier lors de l’enregistrement, et bien plus encore"},"content":{"rendered":"WebStorm 2020.1, la premi\u00e8re mise \u00e0 jour majeure de cette ann\u00e9e, est maintenant disponible\u00a0! Elle apporte une ergonomie plus soign\u00e9e, la prise en charge native de Vuex et de l'API Composition, une option pour ex\u00e9cuter Prettier lors de l'enregistrement et des am\u00e9liorations pour JavaScript et TypeScript.\r\nT\u00c9L\u00c9CHARGER WEBSTORM 2020.1\r\n\r\n\r\nSi vous n'avez que quelques minutes pour d\u00e9couvrir les nouveaut\u00e9s de WebStorm 2020.1, regardez cette vid\u00e9o dans laquelle Paul Everitt, WebStorm Developer Advocate, passe en revue les am\u00e9liorations les plus notables. Si vous souhaitez en savoir un peu plus, poursuivez votre lecture\u00a0!\r\n\r\nLes nouvelles fonctionnalit\u00e9s et am\u00e9liorations se r\u00e9partissent en plusieurs cat\u00e9gories :\r\n\r\n\tErgonomie\u00a0: une nouvelle police par d\u00e9faut pour l'\u00e9diteur, un th\u00e8me clair unifi\u00e9, le mode Zen pour rester concentr\u00e9 sur le codage, la documentation rapide au survol, le mode LightEdit pour une \u00e9dition rapide, et une barre d'\u00e9tat personnalisable.\r\n\tFrameworks\u00a0: prise en charge de Vuex et de l'API Composition, saisie automatique pour Vue dans les fichiers HTML avec liens CDN, am\u00e9lioration de la prise en charge de React et prise en charge compl\u00e8te d'Angular\u00a09.\r\n\tJavaScript et TypeScript\u00a0: documentation rapide plus pratique, nouvelles intentions et inspections intelligentes, prise en charge des fonctionnalit\u00e9s de TypeScript 3.8 et interface utilisateur remani\u00e9e pour la refactorisation Introduce Field.\r\n\tOutils\u00a0: ex\u00e9cution de Prettier lors de la sauvegarde, partage des sessions de terminal, correcteur orthographique int\u00e9gr\u00e9, am\u00e9liorations de Jest, prise en charge de TypeScript avec Yarn 2 et partage plus flexible des configurations d'ex\u00e9cution.\r\n\tContr\u00f4le de version\u00a0: dialogue retravaill\u00e9 pour les commit de rebasage, am\u00e9lioration du travail avec les branches, modifications du flux de commit et installation de Git depuis l'EDI.\r\n\r\n \r\nErgonomie\r\nNouvelle police d'\u00e9dition par d\u00e9faut\r\nDepuis un an, nous avons travaill\u00e9 au d\u00e9veloppement d'une nouvelle police de caract\u00e8res permettant de coder plus confortablement, en se fatiguant moins les yeux. Nous avons ainsi cr\u00e9\u00e9 JetBrains Mono, une nouvelle police de caract\u00e8res open source sp\u00e9cialement con\u00e7ue pour le codage. \u00c0 compter de sa version 2020.1, WebStorm est livr\u00e9 avec JetBrains Mono par d\u00e9faut, avec la possibilit\u00e9 de d\u00e9finir une police de caract\u00e8res personnalis\u00e9e si vous le souhaitez.\r\n\r\n\r\nTh\u00e8me clair unifi\u00e9 pour tous les syst\u00e8mes d'exploitation\r\nPour rendre l'interface utilisateur plus coh\u00e9rente sur tous les syst\u00e8mes d'exploitation, nous avons introduit un th\u00e8me clair unifi\u00e9, IntelliJ Light. Ce th\u00e8me sera d\u00e9sormais disponible dans le menu d\u00e9roulant Theme dans Preferences\/Settings | Appearance &amp ; Behavior | Appearance.\r\n\r\n\r\nMode Zen pour se concentrer sur le codage\r\nNous avons ajout\u00e9 le nouveau mode Zen pour vous aider \u00e0 vous concentrer pleinement sur votre code.\u00a0Il combine les modes Distraction Free et Full Screen, afin que vous n'ayez pas \u00e0 les activer et d\u00e9sactiver chaque fois que vous voulez les utiliser ou les quitter.\r\n\r\nPour activer ce nouveau mode, rendez-vous sur View | Appearance | Enter Zen Mode dans le menu principal ou s\u00e9lectionnez-le \u00e0 partir de la fen\u00eatre contextuelle Switch.\r\n\r\n\r\nUtilisation de WebStorm pour des modifications rapides\r\nAvec le nouveau mode LightEdit, vous pouvez ouvrir un fichier dans une fen\u00eatre d'\u00e9dition de texte sans cr\u00e9er ou charger un projet entier. Voyons comment cela fonctionne.\r\n\r\n\r\n\r\nPremi\u00e8rement, assurez-vous que WebStorm n'a pas encore \u00e9t\u00e9 lanc\u00e9. S'il est en cours d'ex\u00e9cution, le fichier s'ouvrira dans celui-ci et non dans la fen\u00eatre d'\u00e9dition de texte. Ensuite, ouvrez le fichier de l'une des trois fa\u00e7ons suivantes\u00a0:\r\n\r\n\tAllez dans votre dossier projet, faites un clic droit sur le fichier que vous souhaitez modifier et s\u00e9lectionnez WebStorm dans la liste.\r\n\tCr\u00e9ez un lanceur de ligne de commande comme expliqu\u00e9 ici et ouvrez le fichier \u00e0 partir de la ligne de commande.\r\n\tCliquez sur le bouton Open de l'\u00e9cran d'accueil de l'EDI, s\u00e9lectionnez le fichier dont vous avez besoin et appuyez sur Open.\r\n\r\nVous souhaitez passer de l'\u00e9dition de ce fichier individuel \u00e0 un travail sur l'ensemble de votre projet\u00a0? S\u00e9lectionnez File | Open File in Project dans le menu principal ou faites un clic droit n'importe o\u00f9 dans l'onglet de l'\u00e9diteur et s\u00e9lectionnez Open File in Project dans le menu contextuel.\r\nAffichage du popup Documentation au survol de la souris\r\nAvec WebStorm 2020.1, vous n'avez plus besoin d'appeler explicitement le popup Documentation. Il s'affiche automatiquement lorsque vous survolez un symbole. Cela permet de trouver des informations concernant des symboles sp\u00e9cifiques plus rapidement.\r\n\r\n\r\n\r\nNous comprenons que tout le monde ne souhaite pas que le popup Documentation s'affiche au survol de la souris. Dans ce cas, il est possible de d\u00e9sactiver cette fonction dans Preferences\/Settings | Editor | General en d\u00e9cochant la case Show quick documentation on mouse move.\r\nNouvelles options de personnalisation de la barre d'\u00e9tat\r\nPar d\u00e9faut, WebStorm affiche la barre d'\u00e9tat en bas pour permettre une consultation rapide de l'\u00e9tat g\u00e9n\u00e9ral du projet et de l'EDI, et faciliter l\u2019acc\u00e8s \u00e0 divers param\u00e8tres comme l'encodage de fichiers et la mise en \u00e9vidence des inspections. Si vous n'avez pas la barre d'\u00e9tat\u00a0masqu\u00e9e\u00a0et que vous l'utilisez de temps en temps, vous pouvez maintenant d\u00e9cider pr\u00e9cis\u00e9ment de ce que vous souhaitez y voir. Pour ce faire, faites un clic droit sur la barre d'\u00e9tat et d\u00e9cochez chaque \u00e9l\u00e9ment que vous ne souhaitez\u00a0pas\u00a0y voir affich\u00e9.\r\n\r\n\r\n\r\n\r\nFrameworks\r\nPrise en charge de Vuex et de l'API Composition\r\nFace \u00e0 la popularit\u00e9 croissante de Vue.js, nous souhaitons faire de WebStorm l'EDI le plus efficace pour travailler avec Vue. Nous en avons d\u00e9j\u00e0 fait beaucoup pour perfectionner l'assistance au codage de Vue. Cette fois, nous avons y apport\u00e9 deux nouvelles am\u00e9liorations majeures.\r\n\r\nTout d'abord, si vous travaillez avec la biblioth\u00e8que Vuex, vous b\u00e9n\u00e9ficierez d\u00e9sormais de suggestions de saisie semi-automatique pour les symboles de store Vuex et les modules lors de l\u2019\u00e9dition de composants Vue. De plus, WebStorm vous permet d'acc\u00e9der directement \u00e0 la d\u00e9finition des getters, des mutations et des actions.\r\n\r\n\r\n\r\nEnsuite, comme vous pouvez d\u00e9j\u00e0 utiliser l'API Composition de Vue\u00a03 dans votre application via le package @vue\/composition-api, nous avons d\u00e9cid\u00e9 de la prendre en charge dans WebStorm 2020.1. Dans la section des mod\u00e8les du composant, vous obtiendrez d\u00e9sormais des suggestions de saisie automatique et de r\u00e9solution pour les symboles renvoy\u00e9s par la fonction setup() du composant, y compris les propri\u00e9t\u00e9s dans l'\u00e9tat r\u00e9actif, les propri\u00e9t\u00e9s calcul\u00e9es et les refs.\r\n\r\n\r\nSaisie automatique pour Vue dans les fichiers HTML avec liens CDN\r\nUne autre am\u00e9lioration mineure de la prise en charge de Vue.js : si vous configurez Vue en injectant du code dans un fichier HTML statique, WebStorm reconna\u00eetra d\u00e9sormais correctement la syntaxe de Vue. Si vous avez une biblioth\u00e8que Vue li\u00e9e \u00e0 partir d'un CDN dans ce fichier HTML, vous pouvez \u00e9galement la t\u00e9l\u00e9charger. Ainsi, l'EDI pourra fournir une saisie automatique du code bien plus efficace. Pour t\u00e9l\u00e9charger cette biblioth\u00e8que, appuyez sur Alt+Entr\u00e9e sur le lien dans le fichier HTML et s\u00e9lectionnez Download library.\r\n\r\n\r\n\r\nLa saisie automatique du code fonctionne \u00e9galement pour les biblioth\u00e8ques ajout\u00e9es localement \u00e0 votre projet.\r\nAm\u00e9liorations dans la prise en charge de React\r\nWebStorm 2020.1 am\u00e9liore sa prise en charge de React. Tout d'abord, l'EDI sugg\u00e8re d\u00e9sormais d'ajouter des instructions d'importation pour les composants d\u00e9finis via React.memo si vous placez le caret sur ces composants et appuyez sur Alt+Entr\u00e9e. Il les ajoutera \u00e9galement automatiquement lors de la saisie, comme pour tout autre symbole.\r\n\r\n\r\n\r\nDeuxi\u00e8mement, si vous utilisez des composants Material-UI dans votre projet, vous verrez d\u00e9sormais des suggestions de saisie automatique pertinentes lors de la cr\u00e9ation de styles.\r\nPrise en charge compl\u00e8te d'Angular 9\r\nPour vous aider \u00e0 travailler avec Ivy et d'autres fonctionnalit\u00e9s d'Angular 9, nous avons ajout\u00e9 une prise en charge compl\u00e8te de ces fonctions dans WebStorm 2020.1. Vous pouvez utiliser des fonctionnalit\u00e9s telles que la saisie automatique de code et les importations automatiques dans TypeScript et les fichiers des mod\u00e8les sans configuration. Pour plus de d\u00e9tails sur ce qui a \u00e9t\u00e9 ajout\u00e9, consultez cet article de blog.\r\n\r\n\r\n\r\nJavaScript et TypeScript\r\nAm\u00e9lioration de la documentation rapide pour JavaScript et TypeScript\r\nPour JavaScript et TypeScript, la fen\u00eatre contextuelle Documentation affiche maintenant des informations plus utiles, notamment le type et la visibilit\u00e9 du symbole ainsi que l'emplacement o\u00f9 ce symbole est d\u00e9fini. Les informations sur le type sont extraites du service de langage TypeScript.\r\n\r\n\r\n\r\nDe plus, WebStorm affichera d\u00e9sormais correctement les informations ajout\u00e9es en utilisant des balises JSDoc personnalis\u00e9es et les utilisera pour la fen\u00eatre contextuelle Documentation.\r\nConversion automatique en cha\u00eenage optionnel et\/ou en fusion null\r\nDans WebStorm 2020.1, une nouvelle intention permet de convertir automatiquement le code existant en cha\u00eenage optionnel et\/ou en fusion null, la syntaxe introduite dans les derni\u00e8res versions de TypeScript et JavaScript. Pour l'utiliser, placez le caret sur l'expression que vous souhaitez convertir, appuyez sur Alt+Entr\u00e9e et s\u00e9lectionnez l'intention correspondante.\r\n\r\n\r\nInspection pour convertir \"let\" en \"const\"\r\nGr\u00e2ce \u00e0 cette nouvelle inspection, vous pouvez rapidement transformer une variable ayant une valeur non r\u00e9affectable en une valeur constante. Pour ce faire, placez le caret sur le let que vous souhaitez remplacer par un const, appuyez sur Alt+Entr\u00e9e, et s\u00e9lectionnez Convert to const.\r\n\r\n\r\n\r\nSi vous souhaitez r\u00e9aliser la m\u00eame op\u00e9ration sur l'ensemble du projet ou sur un dossier sp\u00e9cifique, vous pouvez utiliser l'action Run inspection by name \u00e0 la place. Pour cela, s\u00e9lectionnez Code | Run Inspection by Name dans le menu principal ou appuyez sur Cmd\/Ctrl+Shift+Alt+I, puis commencez \u00e0 \u00e9crire let used where it could be a const\u00a0et appuyez sur Entr\u00e9e pour s\u00e9lectionner l'inspection. Dans la bo\u00eete de dialogue qui appara\u00eet, vous pourrez configurer un p\u00e9rim\u00e8tre d'inspection personnalis\u00e9.\r\n\r\n\r\n\r\nVeuillez noter que, bien que l'inspection soit activ\u00e9e par d\u00e9faut, elle n'est pas configur\u00e9e pour mettre en \u00e9vidence les variables avec let qui peuvent \u00eatre potentiellement remplac\u00e9es par const dans votre code. Vous pouvez modifier ce comportement dans Preferences\/Settings | Editor | Inspections | JavaScript and TypeScript | ECMAScript 6 migration aids | \u2018let\u2019 used where it could be a \u2018const.\r\nNouvelle intention lpour l'inf\u00e9rence des param\u00e8tres \u00e0 partir des utilisations\r\nDans WebStorm 2020.1, une nouvelle intention permet de d\u00e9duire rapidement des annotations de type de param\u00e8tre ou des types JSDoc \u00e0 partir d'appels de fonction. Comme pour toute autre intention, vous pouvez l'utiliser en appuyant sur Alt+Entr\u00e9e.\r\n\r\n\r\nPrise en charge des fonctionnalit\u00e9s de TypeScript 3.8\r\nWebStorm 2020.1 est fourni avec TypeScript 3.8 int\u00e9gr\u00e9 et iapporte une prise en charge compl\u00e8te des nouvelles fonctionnalit\u00e9s TypeScript 3.8, telles que les importations\/exportations de type uniquement, les champs priv\u00e9s et les op\u00e9rateurs await de niveau sup\u00e9rieur.\r\n\r\nInterface utilisateur remani\u00e9e pour la refactorisation Introduce Field\r\nLorsque vous utilisez la refactorisation Introduce Field (Cmd\/Ctrl-Alt-F) dans WebStorm 2019.3, vous devez effectuer les modifications dans une bo\u00eete de dialogue s\u00e9par\u00e9e, ce qui vous emp\u00eache de travailler directement avec le code et de voir les modifications appliqu\u00e9es au fur et \u00e0 mesure de votre saisie.\r\n\r\nGr\u00e2ce \u00e0 la mise en \u0153uvre actualis\u00e9e de la refactorisation Introduce Field disponible dans WebStorm 2020.1, la refactorisation s'applique avec moins de clics et vous pouvez afficher un aper\u00e7u des modifications dans le contexte du code avec lequel vous travaillez.\r\n\r\n\r\nOutils\r\nEx\u00e9cution de Prettier lors de la sauvegarde\r\nJusqu'\u00e0 pr\u00e9sent, il \u00e9tait difficile d'utiliser Prettier pour mettre en forme vos fichiers lors de la sauvegarde. Il fallait mettre en place un watcher de fichiers ou installer un plugin tiers, ce qui n'\u00e9tait pas pratique. C'est pourquoi nous avons ajout\u00e9 une nouvelle option qui vous permet d'ex\u00e9cuter Prettier lors de la sauvegarde. Vous pouvez la trouver dans Preferences\/Settings | Languages & Frameworks | JavaScript | Prettier.\r\n\r\n\r\n\r\nLorsque la case \u00e0 cocherRun on save for files est s\u00e9lectionn\u00e9e, WebStorm applique la mise en forme \u00e0 tous les fichiers .js, .ts, .jsx et .tsx que vous avez \u00e9dit\u00e9s dans votre projet. Si vous souhaitez appliquer la mise en forme \u00e0 d'autres types de fichiers, ou uniquement \u00e0 des fichiers situ\u00e9s dans des dossiers sp\u00e9cifiques, vous pouvez personnaliser la configuration par d\u00e9faut en utilisant glob patterns.\r\n\r\nSi vous \u00eates pr\u00eat \u00e0 essayer cette nouvelle fonctionnalit\u00e9, n'oubliez pas de d\u00e9sactiver le watcher de fichiers que vous avez utilis\u00e9 \u00e0 cette fin.\r\n\r\nComme promis, nous pr\u00e9voyons \u00e9galement d'ajouter une nouvelle option pour ex\u00e9cuter ESLint lors de la sauvegarde dans une version ult\u00e9rieure. Pour l'instant, nous recommandons d'utiliser un watcher de fichiers pour cela, comme d\u00e9crit ici. Restez \u00e0 l\u2019\u00e9coute des prochaines annonces.\r\nAffichage des sessions de terminal c\u00f4te \u00e0 c\u00f4te\r\nWebStorm 2020.1 vous permet de travailler plus facilement avec l'\u00e9mulateur de terminal int\u00e9gr\u00e9, car vous pouvez d\u00e9sormais diviser les sessions de terminal verticalement et horizontalement. Cette fonctionnalit\u00e9 vous permet de surveiller la sortie de plusieurs outils actuellement utilis\u00e9s sans avoir \u00e0 basculer entre les onglets.\r\n\r\nPour essayer cette nouvelle fonctionnalit\u00e9, cfqites un clic droit n'importe o\u00f9 dans la fen\u00eatre d'outils Terminal  et s\u00e9lectionnez Split Vertically\/Split Horizontally dans le menu contextuel.\r\n\r\n\r\n\r\nSi vous n'avez plus besoin d'avoir plusieurs sessions de terminal, vous pouvez faire un clic droit sur la session que vous souhaitez fermer et s\u00e9lectionner Close Session dans le menu contextuel.\r\nV\u00e9rificateur d'orthographe int\u00e9gr\u00e9\r\n\u00c0 partir de la version 2020.1, WebStorm sera fourni avec Grazie, notre outil intelligent de v\u00e9rification orthographique, grammaticale et stylistique. Grazie prend en charge plus de 15\u00a0langues, dont l'anglais, l'allemand, le russe et le chinois. Nous esp\u00e9rons que cet outil vous aidera \u00e0 \u00e9viter les erreurs lors de l'ajout de commentaires, de messages de commit et de constructions de langage JavaScript.\r\n\r\nD\u00e9couvrons plus en d\u00e9tail comment fonctionne Grazie. Si votre code comporte une erreur grammaticale, elle sera mise en \u00e9vidence de la m\u00eame mani\u00e8re que l'EDI met en \u00e9vidence d'autres probl\u00e8mes dans votre code \u2013 avec une ligne ondul\u00e9e. Pour corriger l'erreur, passez dessus et cliquez sur Fix \u2018Grammar error\u2019\u00a0ou placez le caret sur le mot probl\u00e9matique, puis appuyez sur Alt+Entr\u00e9e et appliquez une correction rapide.\r\n\r\n\r\n\r\nPar d\u00e9faut, Grazie n'est activ\u00e9 que pour l'anglais et ne v\u00e9rifie pas tous les types de fichiers pour les \u00e9ventuelles fautes de grammaire. Vous pouvez ajouter d'autres langues et modifier le comportement par d\u00e9faut dans Preferences\/Settings | Editor | Proofreading (allez dans la section Grammar pour ajuster l'\u00e9tendue des v\u00e9rifications, afficher les r\u00e8gles existantes et ajouter des exceptions).\r\nPrise en charge de .each dans les fichiers de test Jest\r\nLorsque vous testez avec Jest, l'ic\u00f4ne Run doit s'afficher sur la goutti\u00e8re \u00e0 c\u00f4t\u00e9 de chaque test, ce qui vous permet d'ex\u00e9cuter et de d\u00e9boguer un test sp\u00e9cifique. Toutefois, cela n\u2019\u00e9tait pas le cas pour les tests utilisant l'API .each\u00a0: WebStorm ne les reconnaissait pas correctement en raison de leur nature l\u00e9g\u00e8rement diff\u00e9rente. Pour les prendre en charge, nous avons d\u00fb r\u00e9-impl\u00e9menter la fa\u00e7on dont les noms de tests sont pris en charge. Nous y sommes parvenus et vous pouvez donc maintenant ex\u00e9cuter et d\u00e9boguer des tests avec .each \u00e0 partir de la goutti\u00e8re.\r\n\r\n\r\nMise \u00e0 jour de tous les instantan\u00e9s Jest dans un fichier\r\nSi vous effectuez des tests d'instantan\u00e9s avec Jest, vous avez peut-\u00eatre d\u00e9j\u00e0 remarqu\u00e9 que WebStorm vous permet de mettre \u00e0 jour un instantan\u00e9 en un seul clic. Toutefois, il n'\u00e9tait pas possible auparavant de mettre \u00e0 jour plusieurs instantan\u00e9s en m\u00eame temps. Cela signifiait que si vous aviez plus d'un test \u00e9chou\u00e9, vous deviez les relancer plusieurs fois, ce qui n'\u00e9tait pas tr\u00e8s pratique. Pour faciliter les choses, nous avons ajout\u00e9 une nouvelle option pour la mise \u00e0 jour de plusieurs instantan\u00e9s.\r\nPlus de flexibilit\u00e9 lors du partage des configurations d'ex\u00e9cution\r\nPour aider les membres de votre \u00e9quipe \u00e0 travailler plus facilement sur votre projet, vous pouvez partager avec eux la configuration d'ex\u00e9cution que vous avez utilis\u00e9e pour ce projet. De cette fa\u00e7on, ils pourront ex\u00e9cuter le code du projet en utilisant les m\u00eames param\u00e8tres de configuration, quel que soit le syst\u00e8me d'exploitation sur lequel ils se trouvent.\r\n\r\nDans la version 2019.3 et les versions ant\u00e9rieures, vous pouviez y parvenir en s\u00e9lectionnant l'option Share through VCS dans les param\u00e8tres de chaque configuration d'ex\u00e9cution. En cochant cette case, WebStorm enregistrerait la configuration d'ex\u00e9cution souhait\u00e9e dans le dossier .idea et la mettrait \u00e0 la disposition des autres membres de l'\u00e9quipe si vous faisiez ensuite un commit des fichiers correspondants sur le VCS. Cette approche ne fonctionnait pas toujours car les utilisateurs ont souvent le dossier .idea ajout\u00e9 \u00e0 .gitignore.\r\n\r\nDans WebStorm 2020.1, vous aurez plus de contr\u00f4le sur vos configurations d'ex\u00e9cution, car vous pouvez d\u00e9sormais les stocker dans le dossier de projet de votre choix. Pour ce faire, cochez la nouvelle case Store as project file et indiquez le chemin d'acc\u00e8s au dossier dans lequel vous souhaitez stocker le fichier *.run.xml avec la configuration d'ex\u00e9cution s\u00e9lectionn\u00e9e.\r\n\r\n\r\n\r\nGardez \u00e0 l'esprit que si vous souhaitez partager vos configurations d'ex\u00e9cution avec ceux qui utilisent une version de l'EDI ant\u00e9rieure \u00e0 2020.1, nous vous recommandons de choisir .idea\/runConfigurations comme dossier par d\u00e9faut pour \u00e9viter tout probl\u00e8me de compatibilit\u00e9.\r\nUtilisation de Yarn 2 pour les projets TypeScript\r\nNous avons \u00e9tendu la prise en charge initiale de Yarn 2, introduite dans WebStorm 2019.3. D\u00e9sormais, tous les symboles sont correctement r\u00e9solus et peuvent \u00eatre compl\u00e9t\u00e9s automatiquement dans les projets TypeScript lorsque les d\u00e9pendances sont install\u00e9es en utilisant Yarn 2 avec le mode Plug\u2019n\u2019Play.\r\n\r\n\r\nContr\u00f4le de version\r\nBo\u00eete de dialogue remani\u00e9e pour le rebasing des commits\r\nL'action Interactively Rebase from Here, qui est disponible sous l'onglet  Log de la fen\u00eatre d'outils Git, vous permet de modifier, combiner et supprimer les pr\u00e9c\u00e9dents commits. Cela vous permet de rendre votre historique de commit plus lin\u00e9aire et plus compr\u00e9hensible\u00a0.\r\n\r\nDans WebStorm 2020.1, vous trouverez une version retravaill\u00e9e et plus interactive de la bo\u00eete de dialogue Rebasing Commits qui s'ouvre lorsque vous cliquez sur l'action Interactively Rebase from Here. La nouvelle bo\u00eete de dialogue affiche les actions qui peuvent \u00eatre appliqu\u00e9es \u00e0 chaque commit. Elle montre \u00e9galement les d\u00e9tails du commit et vous permet de visualiser le diff et de r\u00e9initialiser rapidement les changements appliqu\u00e9s.\r\n\r\n\r\nAm\u00e9lioration du travail avec les branches\r\nPour faciliter le travail avec les branches, nous avons apport\u00e9 quelques am\u00e9liorations \u00e0 l'interface du popup Git Branches.\r\n\r\n\r\n\r\nTout d'abord, la fen\u00eatre contextuelle comporte d\u00e9sormais une barre de recherche explicite, qui simplifie le processus de recherche des branches distantes et locales existantes. Auparavant, le champ de recherche flottant n'apparaissait qu'au moment o\u00f9 vous commenciez \u00e0 taper le nom d'une branche, ce qui faisait que cette fonctionnalit\u00e9 \u00e9tait difficile \u00e0 d\u00e9couvrir.\r\n\r\nL'autre am\u00e9lioration concerne le bouton Refresh\u00a0: nous l'avons retravaill\u00e9 afin que vous puissiez l'utiliser pour mettre \u00e0 jour les branches distantes existantes.\r\n\r\nEnfin, nous avons ajout\u00e9 \u00e0 la barre d'\u00e9tat les indicateurs de commit entrant (bleu) et sortant (vert).\r\nModifications du flux de commit\r\nAfin de rationaliser le flux de commit, nous avons d\u00e9velopp\u00e9 une nouvelle fen\u00eatre d'outils Commit pour g\u00e9rer toutes les t\u00e2ches li\u00e9es aux commits. Elle est activ\u00e9e par d\u00e9faut pour les nouvelles installations. Si vous \u00eates d\u00e9j\u00e0 utilisateur, vous verrez une indication dans la bo\u00eete de dialogue modale Commit vous permettant de passer rapidement \u00e0 la nouvelle interface.\r\n\r\n\r\nInstallation de Git depuis l'EDI\r\nWebStorm 2020.1 t\u00e9l\u00e9chargera automatiquement Git et le configurera pour vous s'il n'est pas encore install\u00e9 sur votre machine. Plus pr\u00e9cis\u00e9ment, l'EDI vous avertira que Git n'est pas install\u00e9 lorsque vous tenterez d'importer un projet VCS depuis l'\u00e9cran d'accueil ou s'il ne parvient pas \u00e0 trouver le chemin de l'ex\u00e9cutable de Git pour un projet utilisant Git.\r\n\r\n\r\nIl s'agit l\u00e0 des nouveaut\u00e9s les plus significatives. Pour la liste compl\u00e8te des nouvelles fonctionnalit\u00e9s et am\u00e9liorations disponibles dans WebStorm 2020.1, veuillez consulter les notes de publication.\r\n\r\nN'h\u00e9sitez pas \u00e0 nous faire part de vos retours sur WebStorm 2020.1 et \u00e0 nous signaler tout probl\u00e8me rencontr\u00e9 dans notre outil de suivi des incidents. Merci\u00a0!\r\n\r\nL'\u00c9quipe WebStorm\r\n\r\nAuteur de l'article original en anglais :\u00a0Ekaterina Ryabukha","protected":false},"excerpt":{"rendered":"WebStorm 2020.1, la premi\u00e8re mise \u00e0 jour majeure de cette ann\u00e9e, est maintenant disponible\u00a0! Elle apporte une ergonomie plus soign\u00e9e, la prise en charge native de Vuex et de l'API Composition, une opt","protected":false},"author":{"name":"Delphine Massenhove","link":"https:\/\/blog.jetbrains.com\/fr\/author\/delphine-massenhovejetbrains-com"},"featured_media":34263,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"inline_featured_image":false,"footnotes":""},"categories":[907],"tags":[],"cross-post-tag":[],"acf":[],"featured_image":"https:\/\/blog.jetbrains.com\/wp-content\/uploads\/2020\/04\/fr-WebStorm-2020.1.png","_links":{"self":[{"href":"https:\/\/blog.jetbrains.com\/fr\/wp-json\/wp\/v2\/posts\/34262"}],"collection":[{"href":"https:\/\/blog.jetbrains.com\/fr\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blog.jetbrains.com\/fr\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blog.jetbrains.com\/fr\/wp-json\/wp\/v2\/users\/813"},{"embeddable":true,"href":"https:\/\/blog.jetbrains.com\/fr\/wp-json\/wp\/v2\/users\/813"}],"replies":[{"embeddable":true,"href":"https:\/\/blog.jetbrains.com\/fr\/wp-json\/wp\/v2\/comments?post=34262"}],"version-history":[{"count":1,"href":"https:\/\/blog.jetbrains.com\/fr\/wp-json\/wp\/v2\/posts\/34262\/revisions"}],"predecessor-version":[{"id":52607,"href":"https:\/\/blog.jetbrains.com\/fr\/wp-json\/wp\/v2\/posts\/34262\/revisions\/52607"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/blog.jetbrains.com\/fr\/wp-json\/wp\/v2\/media\/34263"}],"wp:attachment":[{"href":"https:\/\/blog.jetbrains.com\/fr\/wp-json\/wp\/v2\/media?parent=34262"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blog.jetbrains.com\/fr\/wp-json\/wp\/v2\/categories?post=34262"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blog.jetbrains.com\/fr\/wp-json\/wp\/v2\/tags?post=34262"},{"taxonomy":"cross-post-tag","embeddable":true,"href":"https:\/\/blog.jetbrains.com\/fr\/wp-json\/wp\/v2\/cross-post-tag?post=34262"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}