Das ist neu in WebStorm 2022.1

Dank der integrierten React-Unterstützung von WebStorm konnten Sie in Ihren Next.js-Projekten alle wichtigen Funktionalitäten bisher schon nutzen. WebStorm 2022.1 fügt Unterstützung für einige Framework-spezifische Aspekte hinzu – z. B. Seiten. Die IDE löst jetzt Pfade auf, die im href-Attribut von Link-Komponenten, in form oder anderen Tags verwendet werden. Die Code-Completion, die Navigation im Code und das Refactoring funktionieren ebenfalls.

In this release, we’ve added proper integration with Volta, a JavaScript tool manager. WebStorm erkennt jetzt automatisch Yarn und npm, wenn sie mit Volta installiert wurden.

WebStorm 2022.1 enthält verschiedene Verbesserungen für Vue 3. Wenn Sie Komponenten global definieren, erkennt die IDE sie jetzt in Ihren .vue-Dateien. WebStorm unterstützt auch die createApp-Syntax. Die Zuordnung zwischen den mit createApp erstellten Apps und den zugehörigen Elementen wird jetzt korrekt vorgenommen. Außerdem wurde Unterstützung für Nuxt 3 hinzugefügt.

Im Toolfenster Services wurde die Docker-UI überarbeitet. Die Überarbeitung erstreckt sich auf Container, Images, Netzwerke und Volumes. Außerdem wird bei Verwendung von Docker 1.6+ die Docker Registry HTTP API V2 unterstützt. Sie können einfache oder passwortgeschützte Docker-V2-Registries anlegen und verschiedene Aktionen ausführen, z. B. Anzeige, Push und Pull von Images.

Wenn Sie die kleinen Details in WebStorm zu schätzen wissen, wird Ihnen die folgende Neuerung mit Sicherheit gefallen. README-Dateien beschreiben oft die Schritte, die für die Ausführung einer Anwendung erforderlich sind, und listen eine Reihe von Befehlen auf, die Sie verwenden können. Mit WebStorm 2022.1 können Sie diese Befehle direkt aus der README-Datei heraus ausführen. Klicken Sie einfach auf das Ausführen-Symbol links neben dem Befehl.

Um das Formatieren von .md-Dateien zu erleichtern, haben wir die schwebende Symbolleiste überarbeitet, die angezeigt wird, wenn Sie einen Textabschnitt auswählen. Neben dem neuen Design ermöglicht die Symbolleiste jetzt auch die Erstellung von Listen und bietet ein Dropdown-Menü zur Auswahl von Überschriftenstilen.

In Markdown-Blöcken können Sie außerdem die neue Aktion Copy code snippet nutzen. So können Sie mühelos den Inhalt in die Zwischenablage kopieren.

In der Structure-Ansicht können Sie Ihre Dateien untersuchen und schneller zu speziellen Stellen navigieren. In diesem Release haben wir das Untersuchen von JavaScript- und TypeScript-Dateien vereinfacht. Die Symbole in einer Datei werden jetzt in einer logischeren Reihenfolge dargestellt. Außerdem zeigt WebStorm jetzt Export-Icons neben exportierten Symbolen an, damit diese leichter zu erkennen sind.

Wir haben das Event Log von WebStorm durch das neue Toolfenster Notifications ersetzt. Wir möchten Ihnen damit einen besseren Überblick über die Benachrichtigungen der IDE bieten, damit Sie nichts Wichtiges verpassen.

Um den nutzbaren Bereich im Debugger-Toolfenster zu maximieren, werden die Tab-Beschriftungen standardmäßig ausgeblendet. Um sie wieder einzublenden oder ihre Position zu ändern, verwenden Sie die Option Show Tab Labels unter Layout Settings.

Der Dialog Structural Search und Replace enthält jetzt eine Liste aller Vorlagen, um die Navigation zwischen ihnen zu vereinfachen. Wir haben außerdem das Symbol Pin Dialog in der oberen rechten Ecke des Dialogs hinzugefügt und die Kontrollkästchen Injected code und Match case an den unteren Rand des Search template-Bereichs verschoben.

Wir haben die Funktionalität von Annotate with Git Blame verbessert, um die Untersuchung von Änderungen zu erleichtern. Die IDE färbt die Unterschiede in den Zeilen direkt im Editor ein, wenn sich die Maus über einer Annotation befindet, und beim Anklicken öffnet sich der Log-Tab des Git-Toolfensters.